Ian Fenn wrote:

I need help from more experienced hands. :-/

I'm not sure I qualify, and I've only been able to give the code a brief look, but I think I can at least put you on the right path.

For starters, it's a lot easier to debug code which is properly indented. You want to condense it to save bandwidth, fine, but after it's debugged. And it's even a 1000 times more important to do so before asking someone else to help debug.

In regards to your CSS problems, I'm sure the answer can be found in simplicity. Your HTML and CSS are unnecessarily verbose and complex. Since your columns are before your center in your source the needed CSS can be very simple. For the most part, it's only when you want to put your content first that the CSS can get complex.


Your basic CSS can be as bellow; the rest should be easy to figure out.

body {
   background : #cc0000;
   color : #000;
   text-align : center;
}
#main {
   margin : auto;
  width : 700px;
   background : #fff;
   text-align : left;
}
#l {
   float : left;
   width : 150px;
}
#r {
   float : right;
   width : 150px;
}
#c {
 margin : 0 150px;
}

And your HTML:

<body>
<div id="main">
   <div id="l"></div>
   <div id="r"></div>
   <div id="c"></div>
</div>
</body>

As per your rounded corners, since each box has only two rounded corners, you can use the containing div for the lower corner and the first child element for the upper corner.

HTH
*****************************************************
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
*****************************************************




Reply via email to