[thelist] Thought I'd try making a site with CSS... (>_<)
Brian Cummiskey
Brian at hondaswap.com
Sun Feb 29 05:18:00 CST 2004
Christian Anderson wrote:
> How can a site look so different between 2
> browsers?
<snip>
> http://d6204322.u40.tokios.com/index.html
Hi Christian
Welcome to css =)
I viewed your site in Ie6, and its centered and looks good.
In mozilla, it falls apart, and is left-aligned.
I assume you are seeing the same results.
Fact is, IE sucks at css =)
what you coded, shows, in mozilla.
some issues to clean up:
First, mozilla requires a padding and margin (set to 0 if you want none)
to be set for each div or block level element, otherwise it will do
wierd things.
to center the page, use this in your body:
body { margin: 0px auto; }
the auto tag will center it.
you also have some background issues in the body tag.
So, try this:
body {
background: #DCDCDC url(back3.gif) bottom right fixed no-repeat;
color: #696969;
margin: 0px auto;
}
your centering here fails, and again, the above, should take care of it.
so change: <div class="white" align="center">
to: <div class="white">
and get rid of FLOAT: none;
"Let the construction begin" is floating over the content, and not
flowing below...
put a breaker cell in between:
<div class="break"></div>
with:
.break { clear: both; padding:0; margin-bottom:5px; }
that should get you started
And honestly, when working with css, you really should use an xhtml 1
transitional, or even better, strict, doctype. it's 98% html 4.01
transitional, but its cleaner, and better code. w3schools.com has a
nice quick tutorial on it.
When designing, i code/refresh with mozilla 1.6 (haven't liked firefox
much yet to upgrade). after it looks good there, i look at it in IE and
see where its failing. Sometimes, things just CAN'T be made perfect
between the two browsers- especially in pixel-perfect designs.
hope this helps.
More information about the thelist
mailing list