There's a CSS trick that uses stacked div's of different sizes to get complex text alignment. (By "complex" text alignment, I mean instead of the usual ragged-right, left-align, and full justification, text alignment along arbitrary shapes. Unfortunately, the demo site is down right now and used to be available here.)
The trick is pretty simple:
If you don't know what I mean, just try out the code below.
The problem is that while the code works in the browser (I'm using Firefox), it does not work in Prince. In Prince, all the divs before the widest div get ignored. The complex text wrapping works only after the widest div.
In the code below, the 3rd div is the widest. Compare the results with FF and Prince:
The trick is pretty simple:
Stack div's of different sizes on top of each other. Float each one to the right (or left) and use "clear:right" (or "clear:left") in each one. The text immediately following the boxes then wraps around the boxes, giving the appearance of complex text alignment.
If you don't know what I mean, just try out the code below.
The problem is that while the code works in the browser (I'm using Firefox), it does not work in Prince. In Prince, all the divs before the widest div get ignored. The complex text wrapping works only after the widest div.
In the code below, the 3rd div is the widest. Compare the results with FF and Prince:
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<style type="text/css">
.float-right {
float: right;
clear: right;
border: 1px solid black;
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div style="width:6em;height:2.5em;" class="float-right"></div>
<div style="width:8em;height:2.5em;" class="float-right"></div>
<div style="width:20em;height:2.5em;" class="float-right"></div>
<div style="width:6em;height:2.5em;" class="float-right"></div>
<div style="width:4em;height:2.5em;" class="float-right"></div>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit,
sed diam nonummy nibh euismod tincidunt ut laoreet dolore
magna aliquam erat volutpat. Ut wisi enim ad minim veniam,
quis nostrud exerci tation ullamcorper suscipit lobortis
nisl ut aliquip ex ea commodo consequat. Duis autem vel eum
iriure dolor in hendrerit in vulputate velit esse molestie
consequat, vel illum dolore eu feugiat nulla facilisis at
vero eros et accumsan et iusto odio dignissim qui blandit
praesent luptatum zzril delenit augue duis dolore te feugait
nulla facilisi. Nam liber tempor cum soluta nobis eleifend
option congue nihil imperdiet doming id quod mazim placerat
facer possim assum. Typi non habent claritatem insitam; est
usus legentis in iis qui facit eorum claritatem.
Investigationes demonstraverunt lectores legere me lius quod
ii legunt saepius. Claritas est etiam processus dynamicus,
qui sequitur mutationem consuetudium lectorum. Mirum est
notare quam littera gothica, quam nunc putamus parum claram,
anteposuerit litterarum formas humanitatis per seacula
quarta decima et quinta decima. Eodem modo typi, qui nunc
nobis videntur parum clari, fiant sollemnes in futurum.</p>
</body>
</html>