L
liorlew
Hello,
I am trying to create a html page (with css) that have a header footer
and 3 columns. the problem is that when I put more than 3 lines in
the center left or right div, it write all over the footer (hides it).
this is my code:
</head>
<body>
<div id="wrapper">
<div id="header">
HEADER
</div>
<div id="container">
<div id="side-a">
rleft side
</div>
<div id="content">
<br>text here </br>
</div>
<div id="side-b">
<br>text here </br>
<br>text here </br>
<br>text here </br>
</div>
</div>
<div id="footer">
FOOTER
</div>
</div>
</body>
</html>
the css is:
body {
text-align: center;
min-width: 700;
}
#wrapper {
text-align: left;
margin: 0px auto;
padding: 0px;
border:0;
width: 750px;
}
#header {
border: 1 solid #ADD8E6;
margin: 0 0 2px 0;
background: #F0FFFF;
}
#pubs_top {
background: #F0FFFF;
margin: 2 0 1px 0;
border: 1 solid #ADD8E6;
}
#menu {
background-image: url("line.bmp");
background-repeat: repeat-x;
margin: 0 0 1px 0;
hight:50;
}
#side-a {
float: left;
width: 150px;
background: #F0FFFF;
margin-bottom: 5px;
margin-top: 2px;
border: 1 solid #ADD8E6;
}
#side-b {
float: right;
width: 150px;
background: #F0FFFF;
margin-bottom: 5px;
margin-top: 2px;
border: 1 solid #ADD8E6;
}
#content {
float: left;
background: #F0FFFF;
width: 58.5%;
margin: 2 5 2px 5;
border: 1 solid #ADD8E6;
}
#footer {
background: #F0FFFF;
border: 1 solid #ADD8E6;
}
does anyone have an idea?
Thanks,
Lior
I am trying to create a html page (with css) that have a header footer
and 3 columns. the problem is that when I put more than 3 lines in
the center left or right div, it write all over the footer (hides it).
this is my code:
</head>
<body>
<div id="wrapper">
<div id="header">
HEADER
</div>
<div id="container">
<div id="side-a">
rleft side
</div>
<div id="content">
<br>text here </br>
</div>
<div id="side-b">
<br>text here </br>
<br>text here </br>
<br>text here </br>
</div>
</div>
<div id="footer">
FOOTER
</div>
</div>
</body>
</html>
the css is:
body {
text-align: center;
min-width: 700;
}
#wrapper {
text-align: left;
margin: 0px auto;
padding: 0px;
border:0;
width: 750px;
}
#header {
border: 1 solid #ADD8E6;
margin: 0 0 2px 0;
background: #F0FFFF;
}
#pubs_top {
background: #F0FFFF;
margin: 2 0 1px 0;
border: 1 solid #ADD8E6;
}
#menu {
background-image: url("line.bmp");
background-repeat: repeat-x;
margin: 0 0 1px 0;
hight:50;
}
#side-a {
float: left;
width: 150px;
background: #F0FFFF;
margin-bottom: 5px;
margin-top: 2px;
border: 1 solid #ADD8E6;
}
#side-b {
float: right;
width: 150px;
background: #F0FFFF;
margin-bottom: 5px;
margin-top: 2px;
border: 1 solid #ADD8E6;
}
#content {
float: left;
background: #F0FFFF;
width: 58.5%;
margin: 2 5 2px 5;
border: 1 solid #ADD8E6;
}
#footer {
background: #F0FFFF;
border: 1 solid #ADD8E6;
}
does anyone have an idea?
Thanks,
Lior