Margin-top attribute ignored when set to 0 on text elements

VERIFIED INVALID

Status

()

Core
CSS Parsing and Computation
VERIFIED INVALID
17 years ago
17 years ago

People

(Reporter: Matt Sheffield, Assigned: Pierre Saslawsky)

Tracking

Trunk
x86
Windows ME
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

(URL)

(Reporter)

Description

17 years ago
From Bugzilla Helper:
User-Agent: Mozilla/5.0 (Windows; U; Win 9x 4.90; en-US; rv:0.9.3) Gecko/20010801
BuildID:    200108110

When CSS is used to set to 0 the top margin of an element which by default has
blank space above it (such as <p> or <ul>), this directive is ignored and the
default top margin is used. When a <div> element is set to have a top-margin of
0, it is also ignored although a <p> element placed below it is correctly rendered.

Reproducible: Always
Steps to Reproduce:
1. See HTML source below.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<title>Mozilla bugs</title>
	<style>
		ul {margin-top: 0;}
		p {text-indent: 1.5em; margin-top: 0;}
		div {text-indent: 1.5em; margin-top: 0;}
	</style>
</head>

<body>
	<h1>Mozilla bugs</h1>
	<h2>Mozilla ignores margin-top attributes on &lt;ul&gt; elements</h2>
	<p>Well, here is some introductory text
		<ul>
			<li>Item one</li>
			<li>Item two</li>
			<li>Item three</li>
			<li>You will notice that this list has a blank line above it even though I have
told it to do otherwise through CSS.</li>
		</ul>
	</p>
	
	<h2>Paragraph margin-top properties ignored as well</h2>
	<p>The second bug is related to the first one. Are <tt>margin-top</tt> attributes
applied to any textual element with a default top margin? It doesn't look that
they apply to <tt>&lt;p&gt;</tt>.</p>
	<p>This should be indented and flush against the previous paragraph. There should
be no extra margin above the text because margin-top has been set equal to 0.</p>
	<div>This division should be indented and have no space between it and the
previous paragraph or it and the following paragraph.</div>
	<p>Curiously, this bug is present when viewing the page with MSIE 5.5 (Win 32)
but the first is not.
	
	<h2>Fixed positioning error</h2>
	<p>Fixed elements which are 100% wide will occasionally overlap the vertical
scrollbar. See <a href="http://ratherbiased.com/bizarre.htm">this page</a> for
an example.</p>

</body>
</html>
The ul has a zero top margin... the <p> has a bottom margin... and <ul> cannot
go inside <p>, so the actual content model the parser produces is:

<p>text</p>
<ul> stuff </ul>

This also explains your second "bug".  <p> has top _and_ bottom margins by
default in Mozilla.  You only reset the top margin to 0....

marking invalid since the style system is working as it should here.
Status: UNCONFIRMED → RESOLVED
Last Resolved: 17 years ago
Resolution: --- → INVALID
*** Bug 129743 has been marked as a duplicate of this bug. ***
yup
Status: RESOLVED → VERIFIED
You need to log in before you can comment on or make changes to this bug.