seanpowell,
Thanks for the great response!
I've seen sites that have the content follow the side sections, I just never really understood why. Thanks for clearing that up.
I'm aware of the centering issue, just didn't do that yet.
I'm curious about the expression statement though. What IE browsers support this? Just IE 6?
Thanks for pointing out the multiple use of the id colorStyle, copied and pasted but forgot to change it.
I increased the point value to 300 because I was so pleased with your response. If you could just clearify a little more on the expression statements compatibility I would really appreciate it.
Main Topics
Browse All Topics
by: seanpowellPosted on 2004-12-15 at 05:44:13ID: 12829653
Hi dirtywerm,
As far as getting the center column to take up the space properly, we need to place it after the left and right column in the html source:
<div id="leftColumn"></div>
<div id="rightColumn"></div>
<div id="centerColumn"></div>
Then we need to remove the float and just set the margins:
#container #leftColumn
{
float: left;
width: 8em;
}
#container #rightColumn
{
float: right;
width:128px;
}
#container #centerColumn
{
/* this will make the div take up the rest of the space */
margin:0 130px 0 8em;
}
On a side note - in terms of centering the whole container, we do this for full browser support:
body
{
margin:0;
padding:0;
/* center the container in IE5+ */
text-align:center;
}
*
{
/* now reset the text alignment for all internal elements */
text-align:left;
}
and then we can center the container with margin:0 auto for compliant browsers. Which leads to the other issue...
We have to use IE's expression to get min-width, but it needs to be in each of the "size" css files (small, medium, large) not in the "structure" file.
#container
{
/* now the correct way to center the container */
margin: 0 auto;
width: 47em;
/* other browsers */
min-width: 752px;
/* IE */
width: expression((this.clientWid
}
Lastly - watch your id's - they need to be unique:
<div class="sideSection" id="colorStyle">
<h5>Color Style</h5>
...
</div>
<div class="sideSection" id="colorStyle">
<h5>Text Size</h5>
...
</div>
A lot going on there, let me know...
Sean