body, height og overflow.
ja. jeg er så ved at lave et design til en hjemmeside... til dette bruger jeg css og <div> tags. meget simpelt i sig selv.nu er det så at jeg i stedet for at have diverse tables osv. på min side har valgt at bruge en nygeligt lært metode hvor jeg smider alt det grafiske ind via <div> tags. både højder bredte osv.
2 filer udgør designet.
index.php og style1.css.
her er index.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="style1.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="container">
<div id="bottom"></div>
<div id="top"></div>
<div id="main_a"></div>
<div id="main_b"></div>
<div id="bar_a"></div>
<div id="bar_b"></div>
</div>
</body>
</html>
og her style1.css
@charset "utf-8";
/* CSS Document */
html, body
{ width: 100%;
height: 100%;
padding: 0;
margin: 0;
}
#container
{ width: 778px;
height: 100%;
margin: 0px auto 0px auto;
padding: 0;
position: relative;
top: 0px;
left: 0px;
border-left: solid 1px #000000;
border-right: solid 1px #000000;
}
#top
{ background: url(bg/top.png) fixed repeat-x top;
width: 778px;
margin: 0;
padding: 0;
position: absolute;
top: 0px;
bottom: 0px;
}
#bottom
{ background: url(bg/bottom.gif) fixed no-repeat bottom;
width: 778px;
height: 170px;
margin: 0;
padding: 0;
position: absolute;
bottom: 0px;
}
#main_a
{ background: url(bg/main.png) fixed repeat-x top;
width: 149px;
position: absolute;
top: 50px;
left: 5px;
bottom: 50px;
padding: 0;
margin: 0;
border: solid 1px #000000;
}
#main_b
{ background: url(bg/main.png) fixed repeat-x top;
width: 609px;
position: absolute;
top: 50px;
right: 5px;
bottom: 50px;
padding: 0;
margin: 0;
border: solid 1px #000000;
}
#bar_a
{ background: url(bg/bar.png);
width: 778px;
height: 20px;
position: absolute;
top: 24px;
padding: 0;
margin: 0;
border-bottom: solid 1px #000000;
border-top: solid 1px #000000;
}
#bar_b
{ background: url(bg/bar.png);
width: 778px;
height: 20px;
position: absolute;
bottom: 24px;
padding: 0;
margin: 0;
border-bottom: solid 1px #000000;
border-top: solid 1px #000000;
}
jeg troede jo så alt var fjong og smed noget indhold i min <div id="main_b"> tag men. som kan ses her
http://xorioz.users.whitehat.dk/nysted/
så er der self noget galt. i skal se det er nok mig der er dårlig til css. anyways. når indholdet i main_b fylder siden ud skal designet følge med. men som det ser ud lige nu regner css kun de 100% i højden ud som værende højden af browseren eller noget i den stil.
hvad er problemet og kan det løses. eller må jeg tilbage og arbejde med tables.
