TechnologyMar 25, 2009

Default CSS Settings

Credera Team

Each browser applies its own default settings to HTML tags.  For example, while IE and Firefox may both add a default top margin to the <p> tag, the size of that margin spacing may be different in each browser.  Further, one browser may apply a default lower margin or padding, for example, while another browser may not.  Ignoring this issue, the spacing before or after <p> tags in your site may appear different between browsers.  This principle is true for many HTML tags, including:

  • All header tags <h>

  • <div> tags

  • <span> tags

  • <p> tags

  • All list tags <ul> <ol> <li>

While this list is not exhaustive, it does provide a starting place to tackle browser compatibility.  The example below illustrates the different default margins applied to the <p> in IE and Firefox.

A simple work around for this issue is to replace each browser’s default styles with your own designated style in the CSS:

p { padding: 0px 0px 0px 0px;  margin: 0px 0px 0px 0px; }

Inserting the above code into your CSS file will overwrite any default margins or padding added by each browser, giving your code a consistent style across all browsers.

Have a Question?

Please complete the Captcha