I have switched from Quirks Mode to Standards Mode (HTML 4.01 Transitional), and have noticed that in IE7 and IE8 all form elements are now styled differently than they have been in Quirks Mode.
In Quirks Mode the select dropdown boxes did not have borders around the elements and looked kind of sleek, whereas after adding the DOCTYPE declaration, select’s are shown with borders both around the input rectangle and around the square with the little black triangle which looks very much like Windows 95.
I am seeing this change in the styling behaviour on Windows 7 systems with the default standard skin with transparency enabled.
Apparently in Quirks Mode the fancy Windows system skin is applied to the styling of forms elements, whereas switching to HTML 4.01 Transitional switches to the classic old-style Windows-95 look. The difference can be seen easily by opening a form in Quirks Mode (i.e. no doctype) in Internet Explorer and then switching the document mode to IE8 Standards via the Developer Tools window (F12).
I don’t have any CSS rules defined for form elements such as input’s, select’s, etc, i.e. this affects the unstyled display of form elements.
My question is: how do I get IE8 to display forms with ‘fancy’ system skins for pages with a doctype?
I realize that I can do custom form styling with CSS but is there a way to enforce system decorations to be applied to default form elements in Standards Mode? Or am I missing something?
The doctype I am using is <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">.
Looks like certain things like the appearance of dropdown buttons cannot be modified – these are browser/os specific.
Why Internet Explorer uses a generic Window Classic style for pages with a DOCTYPE, and the fancy OS-defined decorations for Quirks Mode remains a mistery.