|
|||
Mal wieder ein doofes float Problem
Hallo,
ich mal wieder Probleme beim floaten*g. Ich möchte gerne wir divs auf eienr Seite so anordnen wie hier dargestellt: Aber ich bekomme den Content Bereich einfach nicht dazu, rechts neben dem menu berich zu sein. Was mache ich denn falsch? Dabei sollte wenn es geht, der content Bereich auch komplett bis zum rechten Browserrand hinnüberreichen. Code:
<style type="text/css"> <!-- div#face { border-style:solid; border-width:0; margin-left: 10px; margin-right:auto; margin-top: 10px; margin-bottom: auto; float: left; padding:0px; } div#top { margin-left: 180px; margin-right:auto; margin-top: 10px; margin-bottom: auto; padding:0px; } div#menu { border-left:solid 2px; border-right:solid 2px; border-bottom:solid 2px; padding-top:0px; padding-bottom:25px; border-color: #816344; margin-left: 20px; width:200px; clear:left; } div#content { margin-left:20px; margin-right: 0px; } --> </style> <body> <div id="face"> [img]images/face.gif[/img] </div> <div id="top"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td> [img]images/titel.png[/img] </td> <td class="topright"> <table border="0" width="100%" height="100%" cellspacing="0" cellpadding="0"> <tr> <td class="counter"> 32 </td> </tr> <tr> <td class="subcounter"> 0 </td> </tr> </table> </td> </tr> </table> </div> <div id="menu" align="center"> {(homelink)} {(levelonestart)} <li class="list1">{(mainname)}{(leveloneliend)} {(leveltwostart)} <li class="list2" >{(leveltwoname)} {(leveltwoend)} {(leveloneend)} </div> <div id="content"> »{(linkname)} </div> </body> |
Sponsored Links |
|
|||
Da deine Container unterschiedliche Höhen haben, wird das mit deinem bisherigen System etwas schwierig.
Pack mal #face und #menu in einen eigenen umgebenden Container und lasse nur den floaten. Das gleiche mit top und content. Für den linken container kannst Du feste oder relative Breitenangaben verwenden, für den rechten einfach :auto . Das sollte funktionieren., grüsse andir
__________________
Grüsse Andreas- auch mal wieder da... Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams) Wiedergelesen: > hier und hier [Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte |
Sponsored Links |
|
|||
Ach so,
ein kleines Problem hab ich noch. Ich habe nun für den Inhalt ein ganz normales div, mit padding: 0px; Jetzt möchte ich darin eine Tabelle welche nur aus einer Zeile besteht einfügen, aber im IE ist zwischen dem linken Rand vom div und der Tabelle immer ca. 2px Abstand, den ich nicht weg bekomme. Im Firefox ist dieser Abstand nicht zu sehen. Code:
<div id="test"> <table id="nodes" border="1" cellspacing="0" cellpadding="0"> <tr> <td>[img]images/node_left.gif[/img]</td> <td>[img]images/bar.gif[/img]</td> <td>[img]images/node_right.gif[/img]</td> </tr> </table> </div> Das rote ist das div. Ok, habs schon gefunden, das ist wohl der sogenannte 3px Bug beim IE. Gelöst habe ich es so, wie hier beschrieben: http://www.perun.net/2004/07/09/3-pixel-abstand/ |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Problem mit float und margin | raz | CSS | 4 | 11.12.2008 15:58 |
Problem mit float und position:absolute | infernalshade | CSS | 4 | 12.11.2008 10:52 |
Problem im IE7: div hinter input platzieren per float | Heavenfighter | CSS | 2 | 19.06.2007 16:50 |
Problem mit Layout .. vermute: float | Küspert | CSS | 3 | 09.12.2006 18:09 |
Float Problem, 4 Inhalts Elemente nebeneinander | denny | CSS | 0 | 23.08.2004 15:59 |