Forum Moderators: not2easy
#wrapper
{
color: #000;
margin: 10px auto;
padding: 0;
width: 750px;
background: #fff;
}
I also have the following content classes:
#pagebody
{
padding: 0;
margin: 0;
border: 0;
text-align: left;
color: #091A37;
clear: both;
}
#pagina
{
float: left;
margin: 10px 10px 10px 0;
padding: 0 10px 0 0;
width: 750px;
/* box model hack */
voice-family: "\"}\"";
voice-family: inherit;
width: 710px;
font-size: 9px;
}
The problems are the following:
in #pagina
If I don't put a box model hack in this class, the wrapper increases by about 40 (could be 50) pixels. Although the hack fixes the wrapper problem it obviously limits the width of my #pagina content to 710px.
How can I fix this so the wrapper doesn't increase in size and I can use the full 750px of the #pagina.
Hope I have explained this well enough
many thanks
What DTD are you using?
Also, when you say you have the following content classes and the example begins with a #, I assume you meant to write ID?
yes I did mean ID.
here is the dtd I am using
<!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">
However IE5.* will and there are still quite a lot of people out there with that browser. My appraoch is to put all the fixes for IE5 into one stylesheet and then include it like this...
<!--[if IE 5]>
<link rel="stylesheet" type="text/css" media="all" href="/styles/ie5fix.css">
<![endif]-->
The conditional comments will mean that only browsers in the IE5 family can see the <link>.
In your case the ie5fix.css file would just contain this code:
#pagina
{
width:710px;
}
Another approach is to use a server side script to do some browser sniffing and supply a modified stylesheet. But some browser sniffing scripts are unreliable so I prefer to combine the two and only add the conditional comment when the server side script reckons it might be an IE5 browser.
HTH
