Many CSS resets eliminate the <fieldset> tag’s border, padding, and margin. I suppose this is to ensure they render uniformly across all browsers. However, fieldsets no longer visually separate groups of HTML (form) elements after the reset.
Two questions:
- Do browsers actually render <fieldset> sans reset differently?
-
What is the best method of getting the ‘bordered’ look back after a CSS reset? Simply restyling it like this:
fieldset { border: 1px solid silver; margin: 2px; padding: 7px; }
Some images of what I am describing:
Without reset:

With reset:

The easy answer is: don’t use a reset! They are unnecessary provided you have a clue what you’re doing.
For instance, if you use a reset then you lose any native UI styles, such as, in this case, fieldsets. In IE, for instance, an unstyled fieldset will have a border with slightly-rounded corners, just like fieldsets in native programs. A reset removes that, and non-native UI sucks.
However, if you insist, just make sure that the styles are defined in the right order. The reset should be the absolute first thing, followed by “un-resets”. See, it’s redundant!