Hejsan!
Har ett klassiskt problem med en sida jag håller på med. Jag har sidan indelad i tre delar: top, content och bottom. Jag vill att bottom ska fylla ut det ev utrymmet som är kvar.
Kanske lite väl kortfattat men tror ni förstår, det är bara att fråga annars.
Sidkoden:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title> Mikael Karlsson - Blogg</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<link rel="stylesheet" type="text/css" href="style.css" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="keywords" content="mikael, karlsson, blogg, åsikter, säg what" />
<meta name="description" content="Blogg och portfolio av Mikael Karlsson." />
</head>
<body>
<div id="center">
<div id="top">
</div>
<div id="menu">
<a href="blogg.asp?sort=date_desc&cat=3" class="menulink">Blogg</a> |
<a href="portfolio.asp" class="menulink">Portfolio</a> |
<a href="links.asp" class="menulink">Länkar</a> |
<a href="contact.asp" class="menulink">Kontakt</a>
</div>
<div id="content">
<div id="title">
<img src="images/title_blogg.gif" style="height: 60px; border: 0px;" />
</div>
<a name="top"></a>
<div id="blogmenu">
<table cellspacing="0" cellpadding="0" border="0" style="margin-bottom: 40px;">
<tr>
<td align="left" valign="top">
<a href="?page=archive">Arkiv</a> |
</td>
<td align="left" valign="top">
Sortera:
<select onChange="url=this.options[this.selectedIndex].value; if(url){ location.href=url; }">
<option value="?sort=date_desc&cat=3" selected="selected">Nyast först</option><option value="?sort=date_asc&cat=3">Äldst först</option><option value="?sort=title_desc&cat=3">Titel (0-9, A-Ö)</option><option value="?sort=title_asc&cat=3">Titel (Ö-A, 9-0)</option>
</select>
</td>
<td align="left" valign="top">
| Kategori:
<select onChange="url=this.options[this.selectedIndex].value; if(url){ location.href=url; }">
<option value="?sort=date_desc&cat=">Alla</option>
<option value="?sort=date_desc&cat=1">Kategori 1</option>
<option value="?sort=date_desc&cat=2">Kategori 2</option>
<option value="?sort=date_desc&cat=3">Kategori 3</option>
</select>
</td>
</tr>
</table>
</div>
<div id="blogentry_title">
Titel
</div>
<div id="blogentry_date">
2008-00-00 00:00
</div>
<div id="blogentry_content">
<p>Lorem ipsum dolor sit amet, consectetuer <a href="#">adipiscing</a> elit. Aenean malesuada eros sed dolor. Phasellus pede neque, feugiat ac, ultrices ut, malesuada quis, tellus. <a href="#">Duis ligula</a> orci, semper a, ullamcorper id, porta sit amet, arcu. Suspendisse blandit pellentesque ligula. Ut ante purus, tempor hendrerit, ultricies vel, dapibus eget, magna. Morbi blandit, orci in volutpat lacinia, nulla enim pharetra nisi, eu fringilla velit ligula elementum tortor. Praesent imperdiet elit ac neque. Duis tempus arcu at tortor. Suspendisse porttitor lobortis tortor. Morbi luctus justo in ligula. Morbi eu mi dictum lorem sagittis commodo. Maecenas et nulla. Fusce interdum tristique augue.</p>
<p>Proin vel nibh. Nam eget ligula. Maecenas sapien risus, luctus ac, fermentum ac, posuere a, elit. Lorem ipsum dolor sit amet, consectetuer <a href="#">adipiscing</a> elit. Praesent est metus, placerat non, mollis dictum, pretium at, augue. Nunc eget arcu non pede sollicitudin tincidunt. Quisque aliquam malesuada justo. Nulla et libero ac tortor viverra fringilla. Nulla in sapien eget lacus congue posuere. Curabitur arcu. Duis consectetuer molestie eros. Curabitur urna. Sed sit amet nisl. Nunc in urna quis nisl tincidunt euismod. Nulla eleifend suscipit nisi. Aenean non felis non magna cursus mollis. Ut risus nisi, laoreet ac, euismod id, interdum eu, sem. Phasellus ut justo. Ut pellentesque arcu.</p>
</div>
<div id="blogentry_bottom">
<a href="#">Kommentarer (0)</a> | <a href="?sort=date_desc&cat=kategori">Kategori</a> | <a href="?page=view&id=0" target="_top">Permalink</a> | <a href="#top">Upp</a>
</div>
</div>
</div>
</body>
</html>
Lägg märke till postion: relative som gör så att din div postioneras relativt dokumentet och inte relativt viewport, vilket kan bli mitt i dokumentet för långa dokument.
