Menu
I am losing hair on this one ... it seems that when I fix width an HTML SELECT control it renders its width differently depending on the browser.
Any idea how to to standardize this without having to turn to multiple style sheets?
Here is what I am working with:
.combo
{
padding: 2px;
width: 200px;
}
.text
{
padding: 2px;
width: 200px;
}
This is my document type for the page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
983
It look different because each browser has his own CSS style defined. This styles apply to the HTML markup when no other CSS is defined inline or comes from an external CSS file. That's the reason why a lot of websites using a "Reset. css".
HTML5 is now compatible with all popular browsers (Chrome, Firefox, Safari, IE9, and Opera) and with the introduction of DOCTYPE, it is even possible to have a few HTML features in older versions of Internet Explorer too.
Try setting font-size on the selects as well, that can affect how they are rendered. Also consider the min-width and max-width properties.
154
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
