1

I am working on an internal, custom ASP.NET site that was specified by the customer to only require working in Internet Explorer. This means that no resources have been put forward to make sure it works and looks nice in other browsers, although there is no exotic IE-only technology used or anything like that.

Since eventually someone is going to want other browsers to work, I was wondering if there exists something like a CSS Reset stylesheet that can help make other browsers layout more like IE.

I am looking for a reset stylesheet specifically intended to make Firefox, Chrome, etc, behave more like IE (I'm sure nobody will leave obnoxious comments about this), that won't break too much of the existing layout (which is tested currently only on IE7).

I know I'll have other issues with Javascript, etc, but this question is only about CSS/layout.

In short, does a CSS Reset sheet exist to "reset" CSS to the IE defaults?

Scott Stafford
  • 43,764
  • 28
  • 129
  • 177
  • If you really want to use a CSS Reset, I would just apply a standard one, then add the required styles to make it look the same as it did before the reset in IE. Having done that, the other browsers should look more like IE. – thirtydot Feb 09 '11 at 15:45
  • @thirtydot: I imagine that this is a non-trivial exercise requiring a decent bit of knowledge about browser vagaries, and I was hoping that someone had already done it! ;) – Scott Stafford Feb 09 '11 at 15:48
  • This is a great question, but I really feel that it belongs on http://webmasters.stackexchange.com – Stephen Feb 09 '11 at 15:49
  • You could try googling for "ie7 default stylesheet". – thirtydot Feb 09 '11 at 15:50
  • @thirtydot I concede. Redacted. ;) – Stephen Feb 09 '11 at 15:56

1 Answers1

1

It's not specifically designed for IE but you could use this - It really wont make much difference, what you really need to do is apply it then adapt your existing styles so it looks the same in all browsers.


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
outline: 0;
}
body {
line-height: 1;
color: black;
background: white;
}
ol, ul {
list-style: none;
}
/* tables still need ‘cellspacing=”0″‘ in the markup */
table {
border-collapse: separate;
border-spacing: 0;
}
caption, th, td {
text-align: left;
font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: “”;
}
blockquote, q {
quotes: “” “”;
}

Ass it in a separate .css file and call into the top of your main styles.css file using: @import "reset.css";

Myles Gray
  • 8,711
  • 7
  • 48
  • 70