|
Posted by Greg Scharlemann on 02/12/07 22:42
I'm trying to create two columns within a gray box (#backdrop). I've
setup a <div> for the graybox and thought I could nest another <div>
within it to get the border and separation that I was looking
for...but that didn't work. What is screwing me up here? This isn't
as intuitive as I would have thought...
Thanks
----------------------
<html>
<head>
<title></title>
<style type="text/css">
div.sub {padding: 0; margin: 0 auto; width: 90%; max-width: 950px;}
#main {clear: both; text-align: center;}
#primary {width: 70%; padding-right: 2%;
border-right: 1px solid #CCC;}
#backdrop {background-color:#aaaaaa; border:1px solid #ccc;}
..column {float: left; text-align: left; margin: 1.5em 0;}
..column1 {float: left; text-align: left; margin: 1.5em 0;
width:50%; border-right:1px solid #ccc;}
</style>
</head>
<body>
<div id="main">
<div class="sub">
<div id="primary" class="column">
<div id="backdrop">
<div class="column1">
Testing<Br/><Br/>
Testing 2<br/>
</div>
<div class="column">
TEsting 3<br/><br/>
Testing 4<br/>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Navigation:
[Reply to this message]
|