Hur kommer det sig att width:55em; i t.ex. #footer inte täcker ut hela bredden i Firefox när jag satt att hela sidan ska vara 55em bred.. hmm i IE blir den däremot större men jag gissar att jag måste sätta mig när och räkna på hur stor plats margin och border tar för det ska fixa sig i IE, men det bör (läsas ska) ju fungera i Firefox med.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
</head>
<style>
body, html {
background : #000000;
margin: 0;
height: 100%;
width: 100%;
text-align:center;
}
#main {
background : #FFFFFF;
width:55em;
border-right : 0.2em solid Black;
border-left : 0.2em solid Black;
border-top : 0.2em solid Black;
border-bottom : 0.2em solid Black;
text-align:left;
margin-left:auto;
margin-right:auto;
}
#logo {
width:55em;
height:10em;
border-bottom:0.2em solid black;
}
.content {
margin:0.5em;
font-family : Arial, Helvetica, sans-serif;
font-size : smaller;
width:55em;
vertical-align:top;
}
#menu {
margin-top:0.5em;
margin-right:0.5em;
margin-bottom:1em;
margin-left:0.5em;
font-family : Arial, Helvetica, sans-serif;
font-size : normal;
font-weight : bold;
letter-spacing : 0.1em;
}
#content-left {
width:19.2em;
}
#content-middle {
width:21em;
padding-left:0.5em;
padding-right:0.5em;
}
#content-right {
width:13.8em;
}
#content-table {
width:54em;
border:0;
margin:0;
padding:0;
}
#footer {
border-top: 0.1em dotted black;
margin:0.5em;
font-family : Arial, Helvetica, sans-serif;
font-size : smaller;
width:55em;
vertical-align:top;
}
#content {
border-top: 0.1em dotted #000000;
font-family : Arial, Helvetica, sans-serif;
font-size : smaller;
width:55em;
vertical-align:top;
}
</style>
<body>
<div id="main">
<div id="menu">Lorem ipsum</div>
<div id="content">
<table id="content-table">
<tr>
<td class="content" id="content-left">
Lorem ipsum
</td>
<td class="content" id="content-middle">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis tempus magna eu lectus. Etiam rhoncus. Aenean hendrerit pharetra quam. Maecenas venenatis, elit in interdum vulputate, justo nisl congue velit, dignissim consectetuer lorem nulla a mauris. Nunc lobortis augue eget felis. Vivamus rutrum. Proin nunc dolor, interdum ac, mattis et, venenatis sit amet, orci. Curabitur laoreet. Nullam pulvinar elementum pede. Etiam tempus luctus arcu. Sed sit amet tortor quis sapien tristique dapibus. Cras accumsan hendrerit elit. Donec in mi eget erat lobortis feugiat.</p>
<p>Aliquam consequat erat et enim. Vestibulum sollicitudin. In id tellus. Morbi ligula eros, faucibus sed, pharetra vel, iaculis sed, felis. Nulla lacus. In lacinia. Donec tincidunt sapien at quam. Maecenas placerat eros et lectus. Nulla ipsum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed in pede. Aliquam nec nulla.</p>
<p>Fusce molestie quam vel urna. Donec non ipsum. Phasellus dictum rutrum purus. Mauris mauris. Donec ac sapien. Etiam elit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed rhoncus gravida metus. In id turpis a nunc scelerisque posuere. Nullam ac velit vel est pharetra tincidunt. Duis ut urna ac dolor vulputate euismod. Nam porta. Vestibulum egestas. Aliquam non ante a sem aliquam dignissim. Vestibulum tristique rutrum sapien. Sed mauris sem, dictum vitae, adipiscing at, lobortis eu, eros. Duis tincidunt sem quis neque. Nam id nunc pulvinar est condimentum pharetra. Etiam posuere, leo ut blandit ullamcorper, tellus nunc sollicitudin metus, non iaculis dolor lorem id massa. Vestibulum vehicula varius ligula.</p>
<p>Morbi fermentum neque at turpis. Pellentesque libero risus, condimentum quis, vulputate quis, rutrum condimentum, libero. Nullam placerat libero at quam. Sed adipiscing. Integer sed dui. Quisque rhoncus vestibulum libero. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Integer elit lorem, tincidunt eu, lobortis at, eleifend rhoncus, odio. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec sapien. Curabitur lectus. Etiam vel tortor fringilla mauris pretium feugiat. Cras posuere, enim at tempus porta, augue nunc iaculis nulla, ut pellentesque arcu tortor ut lacus. Fusce pretium. Proin arcu justo, condimentum ac, pretium vitae, tristique eget, libero. Suspendisse auctor tristique urna. Nunc vitae dui. Sed a quam. Nam scelerisque eros id pede. Integer porta sagittis enim.</p>
<p>Cras massa nibh, accumsan nec, fermentum ac, lobortis ut, nibh. Proin ut velit nec velit pretium tincidunt. Nulla mi. Etiam commodo urna quis mi. Morbi facilisis turpis id erat. Etiam ullamcorper, nulla consectetuer aliquet convallis, velit augue vestibulum nulla, nec malesuada nibh dui in orci. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam vitae nunc id urna sollicitudin viverra. Curabitur convallis odio ut dui. Integer ante. Integer urna. Integer ac metus id metus rutrum dignissim. Sed tempus consequat lacus. Suspendisse potenti. Nulla urna. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras sit amet mauris. Duis euismod.</p>
</td>
<td class="content" id="content-right">
Lorem ipsum
</td>
</tr>
</table>
</div>
<div id="footer">
<table id="content-table">
<tr>
<td class="content" id="content-left">
Lorem ipsum
</td>
<td class="content" id="content-middle">
Lorem ipsum
</td>
<td class="content" id="content-right">
Lorem ipsum
</td>
</tr>
</table>
</div>
</div>
</body>
</html>