Positionierung von <div> boxen

Oklino

Guten Tag!
nachdem ich jahre lang mit Frames und Tabellen im Webdesign "improvisiert" habe taste ich mich zur zeit an die Anwendung von <div> elementen als frei positionierte boxen heran...

So weit so gut.
Ich möchte eine Box zur Navigation erschaffen die neben einer Content Box angebracht ist.

<body>
    <div id="site">

        <div id="nav">
         Link1<br />
         Link2<br />
        </div>

        <div id="content">
          Hier steht der Content

        </div>

    </div>
  </body>

dies erstmal zur vereinfachten Darstellung...

Abgesehen davon dass der Internet Explorer (7) erstaunliche Ergebnisse bei der Darstellung der Boxen erzielt, wenn man folgendes stylesheet einbindet:

body
{
text-align:center;
}

#site
{

width:70%;
margin-left:auto;
margin-right:auto;
}

#nav
{
float:left;
width:20%;
background-color:#DDD;
border-width:3px;
border-style:solid;
}

#content
{

width:70%;
background-color:#DDD;
border-width:3px;
border-style:solid;
}

gelingt es mir nicht beide Boxen auf gleicher höhe mit gleichbleibendem Abstand (zwischen den beiden elementen) zu positionieren.

Position:absolute;
top:0px;

schafft beim Höhenproblem zwar Abhilfe ist aber sicher nicht die eleganteste Lösung. Außerdem muss man dann immernoch bei einem Widescreen TFT die navigation am Rand des Bildschirmes suchen

Also wenn jemand ein paar Tipps hat (außer Tabellen ) würde ich mich sehr freuen!

EDIT:
den Höhenausgleich hab ich erzielt und den Codeabschnitt hier im Beitrag korrigiert

evtl. im #content ein float: right

Oklino

ja wunderbar, danke, hat geklappt... der abstand ist jetzt immer "relativ gleich"
ist zwar nicht exakt wie ich es mir gewünscht hab (genauer Pixelabstand zwischen den Boxen) aber zumindest ein guter Kompromiss !

DanielusITF

Wenn du es mal schaffst, eine skalierende, 3-spaltige Seite mit div-layern zu bauen, die in den gängigsten Browsern (eigentlich reicht IE und FF) gleich aussieht, sag mir bescheid. Damit hab ich schon Stunden verbracht.

SideWinder

DanielusITF schrieb:

Wenn du es mal schaffst, eine skalierende, 3-spaltige Seite mit div-layern zu bauen, die in den gängigsten Browsern (eigentlich reicht IE und FF) gleich aussieht, sag mir bescheid. Damit hab ich schon Stunden verbracht.

Gar kein Problem: http://www.thestyleworks.de

MfG SideWinder

Positionierung von &lt;div&gt; boxen

Positionierung von <div> boxen