<p> tag in IE6

Different support to Firefox etc.

[sosidge]

Probably a basic one... I tried a search and found no answer.

Anyway it seems IE6 handles the <p> tag differently to "better" browsers like Firefox - IE6 gives no line break after a </p> tag, whereas the others do.

This is making a bit of a mess of my layout when going from browser to browser.

What is a good universal workaround? Is it a case of not using "<p>text</p><p>more text<p>", but using plain "text<p>moretext<p>", without full tags?

(Also, does IE6 give less spacing above a new <p> tag as well? I think it does, but it could be another thing about my page).

Thanks

[ronin]

Unless you style the <p> tag with a style sheet, IE6 should give you a line break after you close the paragraph.

Check to see if you have a valid doctype as the first line of your html document here:

[w3.org ]

[sosidge]

Everything adds up with a validation - it's HTML 4.01 Transitional

Here is the complete stylesheet...

html {
 overflow-x:hidden;
 overflow-y:auto;
 } 
body {
 background-color: #ffffff;
 margin: 5%;
 }
.lcd {
 font-family: monospace;
 font-size: 16px;
 font-weight: bold;
 background-color: #bfe2f9;
 border-style: ridge;
 border-width: 8px;
 border-color: #000000;
 padding: 2px;
 }
.lcd2 {
 font-family: monospace;
 font-size: 12px;
 font-weight: bold;
 background-color: #bfe2f9;
 border-style: ridge;
 border-width: 6px;
 border-color: #000000;
 padding: 1px;
 }
 
a.lcdlink {
 text-decoration: none;
 color: #000000;
 margin: 2px
 }
 
.main {
 font-family: arial, helvetica, sans-serif;
 font-size: 12px;
 }
 
h1 {
 font-size: 14px;
 }
 
h2 {
 font-size: 16px;
 }
 
h3 {
 font-size: 18px;
 }

No style for p, although I do set the tables the page is built with as style="main"

Here is a bit of code that has no line break...

<table width="100%" border="0" cellspacing="0" cellpadding="0" class="main">
 <tr>
 <td>
 <hr width="100%">
 <p align="center">Any questions? Email me at <a href="mailto:****@yyy.zzz">[e-mail]</a></p>
 </td>
 </tr>
 <tr>
 <td align="center">
 <a href="http://validator.w3.org/check/referer"><img border="0" src="http://www.w3.org/Icons/valid-html401" alt="Valid HTML 4.01!" height="31" width="88"></a>
 <a href="http://jigsaw.w3.org/css-validator/"><img style="border:0;width:88px;height:31px" src="http://jigsaw.w3.org/css-validator/images/vcss" alt="Valid CSS!"></a>
 </td>
 </tr>
</table>

Any comments?

[wdsriram]

try a authoring tool they are designed to take care of these problems.

<snip>

[edited by: korkus2000 at 6:13 pm (utc) on May 28, 2004]
[edit reason] No sigs please [/edit]

[sonjay]

What I've seen is that IE collapses paragraph margins that are at the tops and bottoms of table cells -- your first paragraph inside a cell will have no top margin, and your last paragraph inside a table cell will have no bottom margin.

Mozilla and the other gecko-based browsers display the top and bottom p margins regardless.

There's probably a way to code for this in css to make that consistent, and I'd sure like to know how.

[sosidge]

Sonjay - that is EXACTLY what is happening. Thanks for putting your finger on it.

Anyone know a fix?

[choster]

Have you tried setting a style for paragraphs within tables in the "main" class?

.main th p, .main td p {margin:0} /* if you're trying to eliminate space*/
.main th, .main td {padding:1em 0} /* if you're trying to ensure at least one line of space at the top and bottom of the table cell */

You could also obviate the need for adding align='center' on your <p> tags by adding "text-align:center" to the style.

[SuzyUK]

haven't tested your code, but I've found previously that IE collapses default <p> margins, try putting an explicit margin in your stylesheet for the <p>

all browsers collapse margins under a set of rules, it's a feature, but there have been instances where I found that IE's default (when no explicit setting has been declared) collapse for no reason ;)

p {margin: 1em 0;}

{note: you might require the more specific

td p

or

p

may do it}

Suzy

[sosidge]

Thanks all for the answers. SuzyUK's code seems to have done the job. Thanks again.