CODEWITHSUNDEEP
firefoxxhtmlcssstrict
Hachi
Hachi

Reputation: 3289

CSS - line-height:0 ignored in XHTML strict in Firefox

I'm using :first-line { line-height:0px; } to hide the empty first line in a block statement
curiously if I define doctype in XHTML strict Firefox ignores this statement and prints the empty line (seeable through the border)

I validated my quellcode and used Firefox' webdeveloper to check, if there is anything wrong, but they told no error

the (stripped) example quellcode is:

<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head><title>T</title>

<style type="text/css"><!--
.v { white-space:pre; display:inline-block; border:1px solid black; }
.v:first-line { line-height:0px; }
--></style>

</head><body>

<p class="v">
  Foo
  Bar
</p>

</body></html>

Is there anything wrong with my code and other browsers (I've tested Opera,Gnome,Safari) just ignore the strict, or is Firefox buggy abiding strict?

Upvotes: 0

Views: 560

Answers (2)

Rob
Rob

Reputation: 15168

Try using two colons instead of one. From Mozilla:

The :first-line CSS pseudo-element applies styles to the first line of a element. However, the selector :first-line does not match any real HTML element.

Upvotes: 0

dom
dom

Reputation: 11972

I'm not sure if it's really a bug …

I guess the internals of the :first-line selector fail to recognize an empty line with just a newline character in it, but I'm not sure if this is wanted or not. There is nothing inside the W3C Recommendations to prove this behaviour as wrong or right:

CSS 2.1 Specifications:

5.12.1 The :first-line pseudo-element
The :first-line pseudo-element applies special styles to the contents of the first formatted line of a paragraph.

--

16.6 White space: the 'white-space' property
'white-space'
...
pre This value prevents user agents from collapsing sequences of white space. Lines are only broken at preserved newline characters.

If you're generating your HTML code dynamically just try to eliminate the empty line before outputting it. That's the only advice I can give at the moment.

Upvotes: 2

Related Questions