Master Pages, Themes and Navigation Controls

Re: problems with CSS - Site looks different in IE and Firefox

Amanda Wang - MSFT — Thu, 30 Aug 2007 06:39:02 GMT

Hi,

Would you please post your aspx and css code here for the futher help?

Re: problems with CSS - Site looks different in IE and Firefox

rfurdzik — Wed, 29 Aug 2007 18:59:36 GMT

I was hoping somebody would give me the hand wghat class, html element needs to be fixed... I am struggling with those problems for a while. I am just C# developer, CSS is all new to me...

Re: problems with CSS - Site looks different in IE and Firefox

Adam.Kahtava — Wed, 29 Aug 2007 18:35:58 GMT

For the sake of integrity; most of Amanda's reply was quoted from this article: FF and IE incompatibility

As a rule of thumb; it's less painful to develop your CSS in a browser that is more W3C CSS compliant (like Firefox, Opera, iCab, Safari, and so on) and then make the respective CSS changes for IE.
Quirksmode is an excellent resource for CSS, here are couple links that may be of use:
CSS contents and browser compatibility
Conditional Comments

On a related note, check out the IE Tab addon for Firefox.

IE Tab - an extension from Taiwan, features: Embedding Internet Explorer in tabs of Mozilla/Firefox...
This is a great tool for web developers, since you can easily see how your web page displayed in IE with just one click and then switch back to Firefox. - https://addons.mozilla.org/en-US/firefox/addon/1419

Re: problems with CSS - Site looks different in IE and Firefox

rfurdzik — Wed, 29 Aug 2007 17:47:26 GMT

Thank you Amanda! I will try to fix this using the tools you have recommended. I have Developer Tools for Firefox, but did not make any progress...

Re: problems with CSS - Site looks different in IE and Firefox

Amanda Wang - MSFT — Wed, 29 Aug 2007 05:40:54 GMT

Hi,

You can try to use below tool for debugging your CSS, JavaScript, HTML, and the DOM, and find the cause of the problem.

For IE: Internet Explorer Developer Toolbar Beta 3
For Firefox: Firebug: debug, and monitor CSS, HTML, and JavaScript live in any web page

As a rule of thumb; it's less painful to develop your CSS in a browser that is more W3C CSS compliant (like Firefox, Opera, iCab, Safari, and so on) and then make the respective CSS changes for IE.

Quirksmode is an excellent resource for CSS, below links that may be of use:

hope it helps.

Re: problems with CSS - Site looks different in IE and Firefox

rfurdzik — Tue, 28 Aug 2007 14:05:39 GMT

The designer says that the Ajax tabs can not be fixed in Firefox, but I do not believe this. Please proove me right:) There must be some way...

Re: problems with CSS - Site looks different in IE and Firefox

Dested — Mon, 27 Aug 2007 06:46:17 GMT

The easiest way to go about fixing this adding this piece of css to your website.

http://rikrikrik.com/reset/reset.txt

This will reset all the css to where it should be in all browsers. It will make things break, but when you fix them it will work cross platform.

Re: problems with CSS - Site looks different in IE and Firefox

rfurdzik — Sun, 26 Aug 2007 15:50:11 GMT

Can anybody provide more details what needs to be done? I am not CSS guru, I just know C#...

Re: problems with CSS - Site looks different in IE and Firefox

Dested — Sun, 26 Aug 2007 04:52:35 GMT

Welcome to programming webpages across "standards". It is unfortunate that things do not render as they should in IE (or in your case firefox). There are ways around this, css or javascript scripts called 'IE hacks'. Since you coded for IE its a bit harder to use such hacks, but it will point you in the right direction.

problems with CSS - Site looks different in IE and Firefox

rfurdzik — Sun, 26 Aug 2007 03:20:30 GMT

My site http://www.zikbay.com/ looks OK in IE7, but there are several problems when displaying it in Firefox:

1) The Search box is not correctly adjusted (comparing to IE7 - ideal)

2) In "Adverise Here" section, the left margin is too big, again this looks fine in IE 7.. I used padding: 10px, otherwise it will not look good in IE 7...

3) In "featured" section. The columns are not equal. The third column is too big. It looks OK in IE7

4) The tabs in Ajax Control "By location", "By Map" - this text is not centered inside of the tab. It looks OK in IE 7