Hello,
Is css property for positioning supported? Currently, I am trying to develop a phototagging tool (like facebook), and I want to generate a pdf that includes this image (with the tag captions). Where the captions are generated by the css. here is my css:
<style type="text/css" media="screen,print">
.image { position:relative; }
span.c1 {font-weight: bold}
.map { margin:0; padding:0; background:url(map.jpg) top left no-repeat #fff; padding:2px; font-family:arial, helvetica, sans-serif; font-size:8pt; }
.map li { margin:0; padding:0; list-style:none; }
.map li a { position:absolute; display:block; background:url(blank.gif); text-decoration:none; color:#000; }
.map a.X { top: 258px; left: 45px; width: 19px; height: 21px; }
.map a.family-name { top: 589px; left: 96px; width: 189px; height: 16px; }
</style>
and this is my html:
<body>
<div class="image"><img src="image.jpg" border="0"><br>
<br>
<ul class="map">
<li><a class="X"><span class="c1">X</span></a></li>
</ul>
<ul class="map">
<li><a class="family-name"><span class="c1">family
name</span></a></li>
</ul>
</div>
</body>
When I generated the html, it worked well, the "X" and "family name" is placed correctly. But, when I tried to generate PDF by using princexml, it shows 2 pages where first page is the image.jpg and next page is the list of X and family name.
Please help. Thank you.
Is css property for positioning supported? Currently, I am trying to develop a phototagging tool (like facebook), and I want to generate a pdf that includes this image (with the tag captions). Where the captions are generated by the css. here is my css:
<style type="text/css" media="screen,print">
.image { position:relative; }
span.c1 {font-weight: bold}
.map { margin:0; padding:0; background:url(map.jpg) top left no-repeat #fff; padding:2px; font-family:arial, helvetica, sans-serif; font-size:8pt; }
.map li { margin:0; padding:0; list-style:none; }
.map li a { position:absolute; display:block; background:url(blank.gif); text-decoration:none; color:#000; }
.map a.X { top: 258px; left: 45px; width: 19px; height: 21px; }
.map a.family-name { top: 589px; left: 96px; width: 189px; height: 16px; }
</style>
and this is my html:
<body>
<div class="image"><img src="image.jpg" border="0"><br>
<br>
<ul class="map">
<li><a class="X"><span class="c1">X</span></a></li>
</ul>
<ul class="map">
<li><a class="family-name"><span class="c1">family
name</span></a></li>
</ul>
</div>
</body>
When I generated the html, it worked well, the "X" and "family name" is placed correctly. But, when I tried to generate PDF by using princexml, it shows 2 pages where first page is the image.jpg and next page is the list of X and family name.
Please help. Thank you.