i have a problem with css differences between browsers. i have a simple input textfield an a submit button. the should be arranged. with webkit (safari/webkit) everything looks fine but firefox doesnt do it. does anyone have an idea whats wrong?
i have written a little test html page:
<html>
<head>
<style type="text/css">
#input {
background: none repeat scroll 0 0 white;
border-color: #DCDCDC;
border-style: solid;
border-width: 1px 0 1px 1px;
font: 13px "Lucida Grande",Arial,Sans-serif;
margin: 0;
padding: 5px 5px 5px 15px;
width: 220px;
outline-width: 0;
height: 30px;
}
#submit {
background: none repeat scroll 0 0 white;
border: 1px solid #DCDCDC;
font: 13px "Lucida Grande",Arial,Sans-serif;
margin: 0;
outline-width: 0;
height: 30px;
padding: 5px 10px;
}
</style>
</head>
<body>
<input id="input" type="text" value="" /><input id="submit" type="button" value="Add" />
</body>
</html>
You're not using a Doctype, so browsers fall back to quirks mode:
In the Quirks mode the browsers violate contemporary Web format specifications in order to avoid “breaking” pages authored according to practices that were prevalent in the late 1990s. Different browsers implement different quirks. In Internet Explorer 6, 7 and 8, the Quirks mode is effectively frozen IE 5.5. In other browsers, the Quirks mode is a handful of deviations from the Almost Standards mode.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With