Help - Search - Members - Calendar
Full Version: Difference between Firefox and Internet Explorer
Forums > Resource Center > Webmasters' Corner > Webmasters' Corner Resolved Topics
Note
Seeing that they're some of the most popular browsers [I think] I usually go through both of them to look for bugs in my layouts. I noticed that there were quite a lot of difference when it came to placement in my most recent one and that made me want to ask the question that I wanted to ask for a very long time.

What scripts are read differently when you compare firefox with internet explorer? Yeah, for the first time in my life, the problem is firefox. The layout looks perfect in internet explorer but in firefox . . . things are moved into a new line when they're not suppose to, and things don't move into a new line when I use </br>. So difficult . . . anyways, thanks in advance.
fixtatik
firefox is a standards-compliant browser, meaning that anything that's defined by the world wide web consortium will work in firefox. IE, however, does not follow web standards--microsoft has a bad habit of trying to define the web for themselves.

the differences between the two really depend on the version you're using. the most recent versions (firefox 3 & ie 7) actually don't have too many differences. the biggest ones are probably padding & rounding. IE sometimes rounds pixels, which causes a lot of misalignment, something that doesn't look to be fixed any time soon.

when you say "scripts" are you talking about javascript, or standard CSS? if it's CSS and you're following web standards in your coding, you shouldn't have too many problems when switching between browsers (though IE will always have some kinks). what you can do in some cases is use "hacks." if it's for myspace, you can use conditional IE properties by putting an underscore in front of the property.

for example, if you want the width of something to be 700 pixels in IE, but 800 pixels in all other browsers, you can use
CODE
div { width:800px; _width:700px; }

it's really only a last-measure resort, because in the future if microsoft decides to no longer read CSS hacks, then it won't work anymore.

if it's for a regular website, you can use regular conditional comments:
CODE
<!--[if IE]>
<link rel="stylesheet" media="screen" href="STYLE SHEET URL" />
<![endif]-->
SharperMyspace
Firefox doesn't know how to read height and width! Lame! Stick with IE.
fixtatik
^ actually, firefox reads both width and height perfectly. it's IE that has the problem.

take a look at W3's box model. padding is explained by the guys who are creating the internet. it states that when padding is added onto a box (like a div) of a fixed width, the width becomes the original width plus the padding. so, a div with 400 pixels & 10 pixels padding on each side is actually 420 pixels. IE still reads it as 400 pixels, which is incorrect.

i don't know where you're getting ideas that firefox doesn't correctly read width and height.
nitrogoat
Fixtatik that has really cleared a few things up for me! Makes pretty interesting reading as well happy.gif
allvanishing
The underscore hack doesn't work for IE7, only IE 6.
fixtatik
it still does work for IE 7, as underscores are valid CSS 2.1 (see W3 - it's a lot of garbled jumble, but in summary, if you use underscores in CSS, it's still valid, so it still works in IE 7)

a condensed explanation: link
allvanishing
The page you gave doesn't show that its has been tested in IE7. This page explains that hack with underscores was fixed during the IE7 beta. Only somehow myspace made the underscore hack useable.

On the plus side, you can use an asterisk ( * ) for IE6 & 7.
manny-the-dino
Topic Closed, and Moved to Resolved Topics. Please PM a moderator if you would like this reopened.
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.