PDA

View Full Version : i cant create a div centered between two column divs


silverglade
09-03-2008, 08:24 PM
hi, i have two column divs to the right and left , and i cant create one in the center, when i do try to type in thte center, it automatically makes this huge div around it. any help greatly appreciated. here is the code. derek NOTE. i just created one between them, but i cant get it to wrap around the text, it is just a huge div in the center.

<!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">
<!--
.banner {
float: left;
height: auto;
width: 100px;
}
.top {
width: 50%;
}
#seconddiv {
float: left;
width: auto;
}
#sidepanel2 {
float: left;
width: auto;
}
#apDiv1 {
position:absolute;
left:53px;
top:12px;
width:625px;
height:75px;
z-index:1;
}
#apDiv2 {
position:absolute;
left:33px;
top:97px;
width:90px;
height:440px;
z-index:2;
}
#apDiv3 {
position:absolute;
left:170px;
top:114px;
width:432px;
height:404px;
z-index:3;
}
#apDiv4 {
position:absolute;
left:630px;
top:99px;
width:87px;
height:440px;
z-index:4;
}
#rightside {
float: right;
width: auto;
}
#leftside5 {
float: left;
width: auto;
}
#newleft6 {
float: left;
height: auto;
width: auto;
}
#newleft6 {
float: left;
height: auto;
width: auto;
}
center {
float: none;
height: 130px;
width: 130px;
}
center1 {
height: auto;
width: auto;
}
#center6 {
height: auto;
width: auto;
}
-->
</style>
</head>
<body>
<div id="seconddiv"><img src="file:///C|/wamp/www/MM_DWCS3/Chapter05/banner.png" width="760" height="90" /></div>
<p>&nbsp;</p>
<p>&nbsp;</p>
<div align="center"></div>
<div align="center"></div>
<p>&nbsp;</p>
<div id="rightside">
<p align="right">sdsfsadff<br />
sdfsdfsdfsffsds<br />
fsdfsdfsdfsdfsf<br />
fssdffsdfsdfsf<br />
fsdfsdfdfsfffsf<br />
fsdsdfsdfsffsdf</p>
<p align="right">sdfsdfdsfsfsfd</p>
<p align="right">sdfsdfsdfsfdfsfd</p>
</div>

<div id="newleft6">
<p>sdfsdfsdfsdfsdf</p>
<p>sdfsdfsdfsfdfsd</p>
<p>sdfsdfsdfsdddf</p>
<p>sdfsdfsdfsfdd</p>
<p>sdfsdfsfsfs</p>
<p>sfsdfsdfsddfsd </p>
</div>
<p>&nbsp;</p>
<div id="leftside5"></div>
<div id="center6"></div>
</body>
</html>

domedia
09-03-2008, 08:37 PM
Did you try to start with one of the premade 3 columns css templates?
That would probably give you a good idea how it is done.

silverglade
09-03-2008, 08:46 PM
nevermind i found the answer here. thanks

http://www.domedia.org/oveklykken/css-centering-div.php