Layout issue in Print Mode (Firefox only)

11 views
Skip to first unread message

AP

unread,
Feb 24, 2012, 10:02:26 AM2/24/12
to Blueprint CSS
Hi,

I am facing an issue with the following layout in Print Mode on
Firefox. Please consider the following layout:

<html>
<head>
<title>Blueprint: issue in Print mode (Firefox)</title>
<link href="blueprint/screen.css" rel="stylesheet" type="text/
css" />
<link href="blueprint/print.css" rel="stylesheet" type="text/
css" media="print"/>
</head>

<body>
<div class="span-24">
<div class="span-23 prepend-1" id="summary">
<hr class="space">
<div class="span-4 colborder">
(1) Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Vivamus rhoncus tempus orci, eget tincidunt orci
adipiscing sollicitudin. Nulla consectetur condimentum accumsan.
</div>
<div class="span-17 last">
<div class="span-17 last">
<!--div class="span-10"-->
<div class="span-9 colborder">
(2) Lorem ipsum dolor sit amet,
consectetur adipiscing elit. Vivamus rhoncus tempus orci, eget
tincidunt orci adipiscing sollicitudin. Nulla consectetur condimentum
accumsan.
</div>
<div class="span-7 last">
(3) Lorem ipsum dolor sit amet,
consectetur adipiscing elit. Vivamus rhoncus tempus orci, eget
tincidunt orci adipiscing sollicitudin. Nulla consectetur condimentum
accumsan.
</div>
</div>
<hr class="space">
<div class="span-17">
(4) Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Vivamus rhoncus tempus orci, eget tincidunt orci
adipiscing sollicitudin. Nulla consectetur condimentum accumsan.
</div>
<hr class="space">
</div>
</div>
</div>
</body>
</html>

On screen, it looks fine, but if you preview print it on Firefox, the
section (3) will appear below section (2).

Note: if you replace the <div class="span-9 colborder"> with a <div
class="span-10">, the print preview layout appears fine.

Thanks.

AP
Reply all
Reply to author
Forward
0 new messages