100% height på divs
Hejsa,Jeg har dette layout som passer mig fint.
Eneste problem er at jeg ikke kan få kolonnerne til at have samme højde. Mente man kunne løse det ved at angive height 100%, men det ser ikke ud til at virke...
Hvad gør jeg forkert ?
* { padding: 0; margin: 0; }
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
height: 100%;
}
p {
padding: 6px;
}
#wrapper {
margin: 0 auto;
width: 1225px;
border-style:solid;
border-width:1px;
min-height: 100%;
}
#content {
float: left;
color: #333;
height: 100%;
width: 655px;
display: inline;
background: url("../img/sitebg.jpg");
background-attachment: fixed;
background-repeat: repeat-x;
background-position: top;
background-color: rgb(x,y,z);
}
#header {
position: relative;
color: #333;
width: 1225px;
float: left;
height: 227px;
background-image:url('../img/head.jpg');
}
#footer {
width: 1225px;
height: 25px;
clear: both;
color: #fff;
background: #00455f;
text-align: center;
}
#navigation {
float: left;
width: 1225px;
height: 34px;
color: #333;
background-image:url('../img/menubg.jpg');
}
#leftcolumn {
color: #333;
height: 100%;
width: 285px;
float: left;
background: url("../img/sitebg.jpg");
background-attachment: fixed;
background-repeat: repeat-x;
background-position: top;
background-color: rgb(x,y,z);
}
#boxleft {
margin: 13px 0 13px 13px;
height:200px;
width: 260px;
border-style:solid;
border-width:1px;
border-color: #fff;
background-color: #2b3943;
}
#boxleftdiv {
margin-top: 6px;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 10px;
color: #fff;
}
#boxcenter {
margin: 13px 0 13px 4px;
height: 100%;
width: 645px;
border-style:solid;
border-width:1px;
border-color: #fff;
background: url("../img/boxbg.jpg");
background-repeat: repeat-x;
background-position: top;
background-color: rgb(x,y,z);
}
#boxcenterdiv {
margin-top: 6px;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 10px;
color: #fff;
}
#boxcenterdiv h1{
font-style: italic;
}
#boxright {
float:right;
margin: 13px 13px 13px 0;
height:200px;
width: 260px;
border-style:solid;
border-width:1px;
border-color: #fff;
background-color: #2b3943;
}
#boxright p{
margin-top: 6px;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 10px;
color: #fff;
}
#rightcolumn {
color: #333;
height: 100%;
width: 285px;
float: left;
background: url("../img/sitebg.jpg");
background-attachment: fixed;
background-repeat: repeat-x;
background-position: top;
background-color: rgb(x,y,z);
}
#menu {
margin-top: 2px;
margin-left:20px;
}
/*
CSS Til forms
*/
#login-area {
position: absolute;
bottom:5px;
right:8px;
width: 229px;
height:81px;
margin-top: 0px;
background: url("../img/login.jpg");
}
#login-area input, #login-area textarea {
padding: 1px;
width: 123px;
font-family: Helvetica, sans-serif;
font-size: 1.4em;
margin: 0px 0px 10px 0px;
border: 0px;
}
#loging-area textarea:focus, #login-area input:focus {
border: 0px;
}
#signup {
float: right;
margin-right:30px;
margin-top:7px;
color: #ffffff;
a:visited:
}
#signup a:visited{
color: #ffffff;
}
#login-btn {
float: right;
margin-right:13px;
margin-top:4px;
}