Cross-browser code

[greenie]

This is probably a rookie error, but: I built a page for my Web site in IE 7 and sent it to the server tonight. It looks great in IE 7 but goes bananas in Firefox and Safari. Can anyone suggest a place/site to learn how to write code to acommodate the different browsers? I seem to recall it's usually an if/else function...

  BTW, site is kellypchapman.com. And I searched for info on this, but only found someone having trouble making a FrontPage site work... I write my own code. Well, I'm learning to write my own code. 

  Thanks. (and thanks to all who help run this excellent site.)

[kpac]

You have used absolute positioning is your CSS. That won't affect just different browsers, but also different screen sizes!

Here is the code you have:

Code: [Select]

#text {
color: white;
font-family: verdana;
font-weight: bold;
font-size: 14px;
text-align: right;
position: absolute;
top: 400px;
left: 70px;
width: 860px;
border-top: solid 1px white;
padding: 20 0 0 0
}

It might not be the way forward, but I'd recommend using tables to clean it up, with padding and margin attributes.