Forum Moderators: open
I'm looking to create a certain code that works cross-browser.
Here's the problem:
(1) My CSS looks like this:
.LINKHOME1 {
margin: 0;
position: absolute;
top: 115px;
left: 235px;
width: 70px;
height: 18px;
background-color: #8B795E;
font-weight: bold;
border-style: solid;
border-color: black;
border-width: 0px 0px 1px 0px;
z-index: 1;
overflow: hidden;
}
(2) My HTML looks like this:
<div class=LINKHOME1>home</div>
(3) For some reason, however, Netscape adds a px of padding below the text that Opera and IE do not. Any ideas why? I would greatly appreciate any assistance.
Thanks.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> If not then your browser is in 'quirks mode'.
Opera and IE are emulating the old IE box model bug, NN is not.
For maximum cross-browser compatability you should always use a full doctype like the one above (and validate your code [validator.w3.org] to this standard).
See the W3C Valid Doctype list [w3.org] for the correct doctype for your code.
Strict is the standard to aim for if your are creating new content in my opinion. It won't let you use any of the deprecated tags and enforces various other standards.
This still sounds like a doctype problem.
Does your doctype include the DTD url (as the one in my example does)? And is it the very first line in your document (e.g. no blank or comment lines before it)?