Jeg vil lave en helt almindelig standard-side, som man normalt laver med en
table eller frames.
Med "helt almindelig" mener jeg, at der øverst er en overskrift, under den
er der menu og indhold.
Med en table kunne det fx. se sådan ud:
<table width="100%" border="0" cellspacing="10" cellpadding="0">
<tr>
<td colspan="2" bgcolor="#FFFF00"><h1>eksempel.dk</h1></td>
</tr>
<tr>
<td width="100" valign="top" bgcolor="#FFFF00">
Menupunkt 1<br>
Menupunkt 2<br>
Menupunkt 3<br>
Menupunkt 4<br>
Menupunkt 5<br>
</td>
<td valign="top" bgcolor="#FFFF00">
<h2>Overskrift</h2>
<p>Indhold...</p>
</td>
</tr>
</table>
Hvordan hulen laver jeg det med CSS?
Det nærmeste jeg er kommet er vist dette:
<style type="text/css">
#top {
background: Yellow;
margin: 4px;
}
#menu {
background: Yellow;
float : left;
margin: 4px;
}
#content {
background: Yellow;
margin: 4px;
}
</style>
<div id="top">
<h1>eksempel.dk</h1>
</div>
<div id="menu">
Menupunkt 1<br>
Menupunkt 2<br>
Menupunkt 3<br>
</div>
<div id="content">
<h2>Overskrift</h2>
<p>
Indhold...<br>
Indhold...<br>
Indhold...<br>
Indhold...<br>
</p>
</div>
Men det er da helt skidt. :)
Teksten skal ikke gå ned over menuen, og der skulle gerne være "afstand"
mellem menu og indhold. Hvis jeg fx. sætter en "padding-left" på "content,
så bliver der målt ca. fra menuens venstrekant. "content" går altså lige så
langt til venstre, som "top" gør, og det er jo ikke meningen.
--
Mvh.
Niels Andersen