293335 - Improper space before and after a paragraph (when <p> and </p> are used).

Status: RESOLVED WORKSFORME

(Firefox :: General, defect)

Description

[cv2pf6ip50]

User-Agent:       Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; .NET CLR 1.0.3705; .NET CLR 1.1.4322)
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.7) Gecko/20050414 Firefox/1.0.3    [and all previous versions]

In the page at http://truecrypt.org/history.php (and other pages as well), text 
appears vertically "squeezed" in Firefox (in IE6 it is displayed normally). I 
traced the problem to the <p> and </p> commands. More space (pixel lines) 
should be added before and after a paragraph. 

It should be less pixels than is added by two line breaks <br> <br> but 
definitely more pixels than is added by one <br>.

I understand you may say that IE chose to display it like that and Firefox like 
this and that there are no strict specs. However, as 99% of web sites are 
optimized for IE, I believe that Firefox should adhere to it, if you want it to 
spread. As a user, I was literally disgusted with the way many of my favourite 
sites look in Firefox. It actually prevents me from dumping IE completely. The 
pages just look right and better in IE. People are used to the way their fav 
websites look in IE and will not switch to Firefox. 

Fixing this will definitely help spread Firefox faster.

Thank you.

Reproducible: Always

Steps to Reproduce:
1.Just compare the page in IE6 and Firefox, the problem is easily and clearly 
visible.
2.
3.



Expected Results:  
More space (pixel lines) should be added before and after a paragraph (when <p> 
and </p> are used).

Comment 1

[Thomas K. (:tom)]

Attachment: Truecrypt.org - IE vs FX vs Op

Comparison of spacing between the browsers, fx's is a bit thinner than Operas
and IE's.  Hoewver, I disagree with the use of paragraphs in list items.

Comment 2

[Thomas K. (:tom)]

Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8b2) Gecko/20050504
Firefox/1.0+

Difference is visible, but the spacing is after a list item, not a paragraph.  I
am sorta thinking this is a bug with the other browsers, but I can't be too sure.

Comment 3

[Grey Hodge (jX)]

Page only has slightly different spacing on various elements. Otherwise renders
very well. Mos tpeople would never notice. As it is, however, it is not valid HTML.

http://validator.w3.org/check?uri=http%3A%2F%2Ftruecrypt.org%2Fhistory.php

Try using standard markup and CSS for your margin directives and such, that
would help make a more consistent layout. Plus, the IE team has states that IE6
and below all have problems inconsistency with spacing, and the box model is
known to be broken, both items which are to be at least partially addressed in
IE7 (beta this summer supposedly).

As it is, this isn't a Firefox bug.

Comment 4

[cv2pf6ip50]

(In reply to comment #2)

> Difference is visible, but the spacing is after a list item, not a 
paragraph.  

No, it is not only after a list item, but also after a normal text line 
(whenever <p> or </p> is used). Have a look at for example:

http://www.truecrypt.org/faq.php

The text is vertically squeezed and looks quite ugly. There seems to be no way 
to get 1.5-line spacing in Firefox (only 1 or 2-line spacing). IE6 allows 1.5-
line spacing if <p> is used (instead of <br>).

Comment 5

[cv2pf6ip50]

Attachment: Comparison of http://www.truecrypt.org/faq.php in Firefox and IE6 using transparent windows (Firefox over IE6).

See the bug description.

Comment 6

[Grey Hodge (jX)]

Use CSS to define line spacing as you wish it to be displayed. Most browsers
differ slightly with defautl spacing for elements, which is why CSS is such a
great leap forward.

Comment 7

[cv2pf6ip50]

(In reply to comment #6)
> Use CSS to define line spacing as you wish it to be displayed. Most browsers
> differ slightly with defautl spacing for elements, which is why CSS is such a
> great leap forward.


In other words, instead of fixing this you expect all webmasters in the world 
to change their websites (i.e. to stop using plain <p>) even though they do not 
violate any standards (new standards are ok, but you need to maintain backwards 
compatibility too). I'm afraid that the way you handle bug reports will work 
against Firefox. 

Comment 8

[Grey Hodge (jX)]

No, you misunderstand. In 2005, CSS is already heavily used by the majority of
websites. I'm suggesting you properly use the technologies provided by HTML 4.01
and CSS to define the layout of your website, rather than relying on what is
commonly known as "tag soup". Your documents are currently being rendered in
what is called "quirks mode". This means the layout will adhere to all the bugs
and quirks established by the last generation of web browsers such as IE4 and
Netscape 4, for backwards compatibility. If you were to adhere to a doctype,
such as HTML 4.01 Transitional or Strict, your document would layout much more
consistently in IE and Firefox, as well as Opera, Safari, and other browsers.
Even IE has a Quirks mode and a Strict mode, so this isn't something Firefox is
doing, this is what all browser makers do to handle old tag soup code. I'm
suggesting you bring your pages into the 21st century.

There's lots of easy to use documentation and tutorials on HTML 4.01 and CSS,
and even great tools to work with HTML and PHP pages, such as Dreamweaver or
NVu. Also, running your pages through the W3C Validator will help your debug
problems much easier. http://validator.w3.org/

Comment 9

[Tim De Pauw]

I might be way off here, but I think you'll want to look into setting the CSS
"margin-bottom" property for <p> elements--preferably in em.