262607 - empty generated text with :after and :before changes layout

Status: RESOLVED INVALID

(Core :: Layout: Text and Fonts, defect)

Description

[SR]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.7.3) Gecko/20040910
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.7.3) Gecko/20040910

empty string ( "" ) in generated content makes the containing box bigger than
with no generated content.

a:before
{
 content: "";
}

is different from

a:before
{
 /* no content property modified for any "a" tag so generated content is
    an empty string */
}


Reproducible: Always
Steps to Reproduce:
A real-life test case : I try to insert some content for all links but ones of a
certain class :

a:before
{
 content: "<";
}

a:after
{
 content: ">";
}

a[class~="imglink"]:before
{
 content: "";
}

a[class~="imglink"]:after
{
 content: "";
}

as stated by CSS2, § 12.2, the initial value of content is the empty string, so
I put an empty string ( "" ), in the content for links that should not have
:after and :before generated content.

The link the vary in size depending of this rule being written or not looks like
the following :

<a title="a title" href="" class="imglink" onclick="some javascript"
onmouseover="some javascript">
  <img src="img/zoom.png" class="bouton" />
</a>


Actual Results:  
the box of the links of class imglink take more space with this CSS rule than if
I completely remove it.
I see more space right and left of the image inside the link.

Expected Results:  
I expected the size of the box to be exactly the same as the generated content
is an empty string, which is the default value, hence it should be identical.


Not tested with current nightlies or 1.8a4 because these versions have display
bugs that make them hardly useable.
The HTML I've used has margin set in lots of places, and in particular for the
images.
Maybe the layout states that if there is generated content, then we can't merge
margins as there will be some text. If it is the case, this behaviour should
have an exception, when the text is an empty string.

Comment 1

[Hixie (not reading bugmail)]

CSS2 was erroneous here. CSS2.1 corrects this and makes the initial value 
'normal', not the empty string.

The empty string does indeed imply that the element will be bigger than 
otherwise, since it is an empty inline box, which has hte height of the font, 
just like if it had text.

If 'content: normal' doesn't work, please file a separate bug on that issue.

Cheers.

Comment 2

[SR]

Thanks for the useful information.

I've submitted a bug for the normal content that does not work as I expect :
bug #262624 <https://bugzilla.mozilla.org/show_bug.cgi?id=262624>

I'd be happy that you could invalidate it as well, your comments are always very
informative :)