Lav simpel struktur!

Tags:    html css

Hej
Ønskede side-struktur:
Sådan skal den se ud siden: (Kan være den skal laves om for at virke, men nedenstående angiver hensigten)
<body>
<div id="top"> </div
<div id="menu"> </div>
<div id="SELVE SIDENS INDHOLD"> </div>
<div id="bottom"> </div>
</body>
Height og width for hele dokumentet skal være 100%, "top" skal have height 15%, "menu" skal have en heigth på 20px, på bottom height 10%, indhold skal have en height på det "som der er tilbage"

Kan I se, hvad jeg mener?

Hvis ikke det er banalt, simpelt at lave i css, så vis gerne, hvordan dette laves i tables.
Tak



8 svar postet i denne tråd vises herunder
2 indlæg har modtaget i alt 2 karma
Sorter efter stemmer Sorter efter dato
Jeg vil tro det er noget som dette du vil have:

http://www.themaninblue.com/experiment/footerStickAlt/

Skriv endeligt igen, hvis du ikke kan forstå eksemplet, så vil jeg forsøge at forklare.



Arrg...
Nu fandt jeg fejlen:

<style>
body {
margin: 0px;
}
</style>
<table width="100%" height="100%" border="1">
<tr>
<td height="15%" valign="top">Top</td>
</tr>
<tr>
<td height="20" valign="top">Menu</td>
</tr>
<tr>
<td height="75%" valign="top">Textfelt</td>
</tr>
<tr>
<td height="10%" valign="top">Bund</td>
</tr>
</table>



<table width="100%" height="100%">
<tr>
<td height="15%">top</td>
</tr>
<tr>
<td height="20">Menu</td>
</tr>
<tr>
<td valign="top">Sidens indhold</td>
</tr>
<tr>
<td height="10%">Bund</td>
</tr>
</table>



Hvis du sætter det ind i et dokument, så virker det ikke!? - Top er ikke 15% fx og indhold er lille....



Så er der noget galt ved dig, hos mig virker det fint i IE og FF, men du kan også prøve den her:
<table width="100%" height="100%">
<tr>
<td height="15%">top</td>
</tr>
<tr>
<td height="20">Menu</td>
</tr>
<tr>
<td height="55%" valign="top">Sidens indhold</td>
</tr>
<tr>
<td height="10%">Bund</td>
</tr>
</table>



Hej
Ønskede side-struktur:
Sådan skal den se ud siden: (Kan være den skal laves om for at virke, men nedenstående angiver hensigten)
<body>
<div id="top"> </div
<div id="menu"> </div>
<div id="SELVE SIDENS INDHOLD"> </div>
<div id="bottom"> </div>
</body>
Height og width for hele dokumentet skal være 100%, "top" skal have height 15%, "menu" skal have en heigth på 20px, på bottom height 10%, indhold skal have en height på det "som der er tilbage"

Kan I se, hvad jeg mener?

Hvis ikke det er banalt, simpelt at lave i css, så vis gerne, hvordan dette laves i tables.
Tak


Årh det ville være en fryd hvis i stoppede den gang slamkode. CSS vil være 100 gange smartere her, det er vel heller ikke for sjov at han på forhånd har givet eksempel i div's.

Mvh. Emilbp



>( Emil, kom med et konstruktivt forslag, hvis det er så nemt.)


>Dit link: Det ser for avanceret ud, prøv bare at tage udgangspunkt i mit eksempel. Alle bokse skal have width 100%.



Arrg...
Nu fandt jeg fejlen:

<style>
body {
margin: 0px;
}
</style>
<table width="100%" height="100%" border="1">
<tr>
<td height="15%" valign="top">Top</td>
</tr>
<tr>
<td height="20" valign="top">Menu</td>
</tr>
<tr>
<td height="75%" valign="top">Textfelt</td>
</tr>
<tr>
<td height="10%" valign="top">Bund</td>
</tr>
</table>


<style>
html, body { height:100%; margin:0px; padding:0px; }
#top { height:15%; }
#menu { height:20px; }
#bottom { height:10%; position:absolute; bottom:0px; }
</style>

- Mads

[Redigeret d. 21/12-05 14:09:32 af Mads]



t