"Padding" is ignored when you render the screen to

Posted by Feavere on 11-May-2015 09:55

Hi,

I have a table in my view in Rollbase which I have created using HTML in a script component.

PDF button ignores the Padding.

<style type='text/css'>

.tablepay1 {
font-family: times new roman,times;
font-size: 8pt;
background-image : url({!#HOSTED_FILE.81940#url});
background-repeat: no-repeat;
line-height: 110%;
width:703px;
height:290px;

}
</style>

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
<table class="tablepay1" align="center" width="100%" border="2">
<tbody>
<tbody class="bodypay">

<tr> <td><div style='padding-top: 45%'></div></td></tr>
<tr >
<td>
<div style='padding-left:31px'>{!R91863.Forename1}&nbsp;{!R91863.Surname#text}</div>
</td>
</tr>
<tr >
<td>
<div style='padding-left:31px'>{!Address1#value}</div>
</td>
</tr>
<tr >
<td>
<div style='padding-left:31px'>{!Address2#value}</div>
</td>
<td align="right">
<div style='font-size: 10pt; color:green;'><strong>Cost Centre:</strong></div>
</td>
<td>
<div>{!CostCentreTitle#value}</div>
</td>
</tr>
<tr>
<td>
<div style='padding-left:31px'>{!Address3#value}</div>
</td>
<td align="right">
<div style='font-size: 10pt; color:green;'><strong>Department:</strong></div>
</td>
<td>
<div>{!DepartmentTitle#value}</div>
</td>
</tr>
<tr height="0.5">
<td>
<div style='padding-left:31px'>{!Address4#value}</div>
</td>
</tr>
<tr >
<td>
<div style='padding-left:31px'>{!PostCode#value}</div>
</td>
</tr>
<tr><td><div style='padding-top: 5%'></div></td></tr>
</tbody>
</table>
</body>
</html>

It all aligns lovely in Rollbase but when I select the PDF button all of my style padding get striped out and no longer aligns to the background image.

Is there a workaround for this?

Regards,

Liz

Rollbase - Forum

All Replies

Posted by Godfrey Sorita on 12-May-2015 11:34

Hi Liz,

You need to move your CSS inside the body of the HTML. Please check modified script below:

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
	
<style type='text/css'>
.tablepay1 {
	font-family: times new roman,times; 
	font-size: 8pt;
	background-image : url({!#HOSTED_FILE.81940#url});
	background-repeat: no-repeat;
	line-height: 110%;
	width:703px;
	height:290px;
}

.valueCol {
	padding-left: 31px;
}
</style>

<table class="tablepay1" align="center" width="100%" border="2">
	<tbody class="bodypay">
	<tr>
		<td><div style='padding-top: 45%'></div></td>
	</tr>
	<tr >
		<td><div class="valueCol">Sample Forename&nbsp;{!R91863.Surname#text}</div></td>
	</tr>
	<tr >
	<td><div class="valueCol">Sample Address</div></td>
	</tr>
	<tr >
		<td><div class="valueCol">Sample Address 2</div></td>
		<td align="right"><div style="font-size: 10pt; color:green;"><strong>Cost Centre:</strong></div></td>
		<td><div>Sample Cost Centre</div></td>
	</tr>
	<tr>
		<td><div class="valueCol">Sample Address 3</div></td>
		<td align="right"><div style="font-size: 10pt; color:green;"><strong>Department:</strong></div></td>
		<td><div>Sample Department Title</div></td>
	</tr>
	<tr height="0.5">
		<td><div class="valueCol">Sample Address 4</div></td>
	</tr>
	<tr >
		<td><div class="valueCol">Sample post Code</div></td>
	</tr>
	<tr>
		<td><div style='padding-top: 5%'></div></td>
	</tr>
</tbody>
</table>
</body>
</html>

Hope this helps.

Godfrey

Posted by Feavere on 13-May-2015 06:47

Hi Godfrey,

I did as you suggested but it made no difference when using the PDF button.  It is still ignoring the Padding..  I even tried "Margin-top" - still ignored within the html tags.

I am using Rollbase 3.2 would it be different in a newer release?

Regards,

Liz

Posted by Godfrey Sorita on 13-May-2015 08:38

I believe the PDF button in pages is not meant to be used to export custom templates. Please use HTML document template (rendered as PDF) instead. This will work even in 3.2.

Posted by Feavere on 13-May-2015 09:16

Hi,

It is just a script component  I used instead of the fields in the view...

All our objects in Rollbase come from OpenEdge so we can't get the same effect against a record using a document template.  Besides I did try that and got the same result and it ends up all out of alignment.

Regards,

Liz.

Posted by Godfrey Sorita on 13-May-2015 14:42

I noticed that the CSS rules are ignored when using the PDF button. A workaround you can use is to add multiple &nbsp; before the token or label. This will act as padding in your elements. Please check sample html code below:

<table border="1">
  <tr>
  	<th colspan="4" align="center">Table Title</th>
  </tr>
  <tr>
  	<td width="150">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Your Label</td>
  	<td width="150">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Your Token</td>
  </tr>
</table>

Posted by Feavere on 14-May-2015 03:58

Hi,

I will try the work around but is this likely to be corrected?

Many Thanks,

Liz

Posted by Godfrey Sorita on 18-May-2015 15:22

There is no request for this feature at the moment. Please file an enhancement request in the ideas section of Rollbase (https://community.progress.com/community_groups/products_enhancements/i/rollbase/default.aspx).

Posted by Feavere on 19-May-2015 02:49

Hi,

Well the &nbsp works but make the code look a mess...

An HTML document with the "render to PDF" ticked ignores the spacing in the same way so I would say it might be a bug rather than an enhancement.

Cheers,

Liz

Posted by Godfrey Sorita on 19-May-2015 08:18

Did you use the previous code I provided? In my environment, the padding is adjusting as expected when the HTML is rendered as PDF.  

Posted by Godfrey Sorita on 19-May-2015 10:24

Defect PSC00333181 has been logged to track this issue.

Posted by Feavere on 20-May-2015 08:29

Many thanks :)

This thread is closed