Log in / Register

Forum › Bugs

No space between white-space:nowrap span tags = overlapping

adrian_es
This code is intended to reproduce the line breaks of a printed text on large screens, but allowing a free flow on small screens:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html lang="en" dir="ltr" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="en">
<title>title</title>
<style media="screen">
.page { page-break-before:always; height:42.5em; width:25.9375em; }
p .span { white-space:nowrap; }
</style>
<style media="handheld">
p .span { white-space:normal; }
ins { display:none; }
</style>
</head>

<body>

<div class="page">
<p
><span>Nancies, and old women of the fashionable and literary</span>
<span>worlds of America extravagantly to extol every thing Eng<ins>-</ins></span
><span>lish, it will be deemed reprehensible temerity in any man, to</p>
</div>

</body>
</html>


Using the above code, the resulting prince-converted PDF displays the line after the hyphen overlapped on top of the previous line. A space between </span><span> is fine for media=screen, but results in "Eng lish", instead of "English" for media=handheld, so there should be no space between these span tags.
mikeday
I'm afraid I can't reproduce this problem with --media=screen or --media=handheld. Are you applying any other style sheets? Can you email me (mikeday@yeslogic.com) the incorrect PDF output?
adrian_es
Here's my test.html and the resulting PDF.
  1. test.zip‎ 44.5 kB
mikeday
The problem seems to be markup like this:
span { white-space: nowrap }
<span>long chunk of text</span><span>another long chunk of text</span>

Because there is no space between "text" and "another" there are no line-breaking opportunities. Could you perhaps add a zero-width space here?
adrian_es
Actually it seems I will have to rethink my code, as Internet Explorer does insert line breaks between those span tags but Firefox doesn't.

These won't work:

<span>text text text<ins>- </ins></span
><span>text text text</span>

<span>text text text</span><ins>-</ins
><span>text text text</span>


This works:

<span>text text text</span><ins>- </ins
><span>text text text</span>


Thank you anyway.