Welcome to WebmasterWorld Guest from 54.205.89.199

Forum Moderators: incrediBILL

Message Too Old, No Replies

Problems with Firefox rendering of my page

     

Syman

3:03 pm on Oct 6, 2004 (gmt 0)

Inactive Member
Account Expired

 
 


hallo, i have a problem with the design of my site in firefox. it differs from the design in IE throught that, that there are gaps between the gifs in the menu-, news-, and links-bar.has this problem something to do with linebreaks in the source code? please help me, i go crazy...thank you

Syman

<Sorry, no personal URLs. See TOS [webmasterworld.com]>

[edited by: tedster at 4:17 pm (utc) on Oct. 6, 2004]

4:33 pm on Oct 6, 2004 (gmt 0)

Senior Member

WebmasterWorld Senior Member tedster is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:May 26, 2000
posts:37301
votes: 0


Welcome to the forums, Syman.

If the gaps you see are between the top and the bottom of images, you may well have Quirks Mode vs. Standards Mode issue. See [webmasterworld.com...] for full details. This is something you will want to know about, if you don't already

5:18 pm on Oct 6, 2004 (gmt 0)

New User

10+ Year Member

joined:Aug 19, 2004
posts:7
votes: 0


Thanks for the relevant and helpful link, Tedster.

Adding the following css fixes the site:

td img { 
display:block;
margin:0;
padding:0;
}

cu Andreas ;-)

3:12 pm on Oct 7, 2004 (gmt 0)

Junior Member

10+ Year Member

joined:Sept 21, 2004
posts:87
votes: 0


One of the main headaches is the <p> tag. It seems that FF inserts a line break before the <p> tag and IE inserts it after. <br /> is the safe choice as it renders the same in all browsers.
3:37 pm on Oct 7, 2004 (gmt 0)

Senior Member

WebmasterWorld Senior Member tedster is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:May 26, 2000
posts:37301
votes: 0


Joe, are you talking about the default space between paragraph elements (usually that's the margin), or the basic fact that a paragraph begins on a new line (line break)?

My first thought is that you are talking about the extra space that is created by top and bottom margins - there should be a simple line break both before and after any block level element, such as a <p>. I've only seen Safari get this one wrong, and even then, only in very special cases where both text-alignment and margins change from one <p> to the next.

But how a browser sets the margins for a <p> by default, and how any two neighboring margins are collapsed, that can be a bit chaotic cross browser.

3:53 pm on Oct 7, 2004 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Mar 19, 2003
posts:1001
votes: 0


you can avoid a lot of misery w/one of SuzyUK's tricks:

* {
padding: 0;
margin: 0;
}

This will just set these to every element as 0, and add margins and padding as desired for the elements you declare. Gets over the 'browser defaults are different' problem.

3:59 pm on Oct 7, 2004 (gmt 0)

Junior Member

10+ Year Member

joined:Sept 21, 2004
posts:87
votes: 0


tedster

IE breaks after a <p> tag as for instance <p>&nbsp;</p><img src="somepic.jpg">

In this instance you'd have picture, then break in IE.
In FF you'd have break, then picture.

If you do it like this
<br /><img src="somepic.jpg">

Or like this

<img src="somepic.jpg"><br />

you should get the same result in all browsers. As for general page margin, only Opera complains about

body {margin: 0px;}

At least, these are my findings.. :D

 

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

Featured Threads

Free SEO Tools

Hire Expert Members