Re: FN-FORUM: CSS nightmare

date posted 11th August 2003 17:22

The Chridmeister wrote on the 11/08/2003 16:59 the following fine words:

> Can someone have a look and tell me what I might be doing wrong? I'm
> going bonkers.
>
> Chrid

Chrid

You can get it pretty close to what you want (not pixel perfect between
browsers) using the code below:

Essentially I've removed the absolute positioning and used float. What
will mess you around is the interpretation of width between the
browsers. Some (IE) include the padding and border as part of the
elements width and others (Moz) do not.

You should be able to get it 100% right eventually perhaps using
negative borders. Have a look at:
http://www.thenoodleincident.com/tutorials/box_lesson/index.html
http://www.glish.com/css/

Both have links to other resources...

HTH

JohnO



body {
background-color: #CC66CC;
color: #000000;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
text-align:center;
}

.little {
font-size: 0.7em;
text-align:left;
}

div.boxgreen {
border: thin solid Black;
background: #66FF33;
padding: 5px;
width: 48%;
float:left;
}
div.boxcyan {
border: thin solid Black;
background: #00FFFF;
padding: 5px;
width: 48%;
float:right;
}
.bigger {
font-size: 1.0em;
}
.shoutsmaller {
color: #000000;
font-size: 1.1em;
font-weight: bold;
}
div.mainbox {
width:80%;
margin-left: auto;
margin-right: auto;
}




--
John Olival
Explican Internet Solutions
+44 (0)870 432 4319
http://www.explican.com
----