Can't place second sidebar?????
i trying place second identical sidebar on page adsense.
here css:
#page {
width: 940px;
margin: 0px auto;
padding: 5px;
position: relative;
top: 20px;
background-color:#f3efa3;
border: 3px groove #00bfff;
}
#sidebar {
background: #c0dcc0;
width: 120px;
border: 2px solid #2a0000;
position: absolute;
height: 600px;
top: 200px;
right: 2%;
float: right;
}
#sidebar2 {
background: #c0dcc0;
width: 120px;
border: 2px solid #2a0000;
position: absolute;
height: 600px;
top: 200px;
left: 2%;
float: left;
}
#footer {
width: 70%;
font-family: arial, helvetica, sans-serif;
color:#d47f00;
position: relative;
bottom: 30px;
text-align:center;
z-index: 1;
left: 15%;
height: 30px;
vertical-align:text-bottom;
line-height: 30px;
margin-bottom: 30px;
margin-top: 50px;
top: 95%;
}
this 2 divs either side of central column #page , above #footer. #sidebar great.
thought work left hand div #sidebar2, sits way below #page , pushes footer way down.
help great.
i hopeful resolution guys having 100% success rate me far.
cheers.
message edited by: hobittual ps found out works local file in browser, not when upload server?
you cannot float absolutely positioned elements. it's 1 or other.
try this:
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.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> <style type="text/css"> body { width: 940px; margin: 0px auto; padding: 5px; background-color:#f3efa3; border: 3px groove #00bfff; font-family: arial, helvetica, sans-serif; } #sidebar1 { background: #c0dcc0; width: 18%; border: 2px solid #2a0000; float: left; min-height: 600px; } #maincontent { float: left; width: 60%; margin-left: 1%; margin-right: 1%; min-height: 600px; } #sidebar2 { background: #c0dcc0; width: 18%; border: 2px solid #2a0000; float: right; min-height: 600px; } #footer { clear:both; color:#d47f00; text-align:center; } </style> </head> <body> <div id="sidebar1"> sidebar1 </div> <div id="maincontent"> maincontent </div> <div id="sidebar2"> sidebar2 </div> <div id="footer"> footer </div> </body> </html>
nancy o.
More discussions in Dreamweaver support forum
adobe
Comments
Post a Comment