jasper html display problem in firefox and opera
Qweed
I am running into some display problems in firefox and opera while
displaying a jasper generated html page in a FormHandler.
The problem is the vertical spacing displayed in the HTML widget are
too big.
This happens in firefox and opera (IE is fine).
When viewed normally (open the file directly in browser) it is fine.
Is there some CSS I need to set for the HTML widget?
Or some special html doctype I need to use?
please help.
here is the test code:
p.s. I have also tried to use Grid instead of HTML; use RequestBuilder
instead of form
but no luck
java
.....
public void onModuleLoad() {
final HTML label = new HTML("html");
final FormPanel pageForm = new FormPanel();
pageForm.setEncoding(FormPanel.ENCODING_URLENCODED);
pageForm.setMethod(FormPanel.METHOD_GET);
pageForm.setAction("test.html");
pageForm.setVisible(false);
pageForm.addFormHandler(new FormHandler(){
public void onSubmit(FormSubmitEvent event) {}
public void onSubmitComplete(FormSubmitCompleteEvent
event) {
label.setHTML(event.getResults());
}
});
RootPanel.get("main").clear();
RootPanel.get("main").add(label);
RootPanel.get("main").add(pageForm);
pageForm.submit();
}
....
host html page
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta name='gwt:module' content='org.test.Main=org.test.Main'>
</head>
<body>
<script language="javascript" src="org.test.Main/gwt.js"></
script>
<div id="main"></div>
</body>
</html>
test.html (generated by iReport in this case, "test.html_files/px" is
a transparent 1x1 gif)
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<style type="text/css">
a {text-decoration: none}
</style>
</head>
<body text="#000000" link="#000000" alink="#000000" vlink="#000000">
<table width="100%" cellpadding="0" cellspacing="0" border="0">
<tr><td width="50%"> </td><td align="center">
<a name="JR_PAGE_ANCHOR_0_1"/>
<table style="width: 595px" cellpadding="0" cellspacing="0"
border="0">
<tr>
<td><img alt="" src="test.html_files/px" style="width: 48px; height:
1px;"/></td>
<td><img alt="" src="test.html_files/px" style="width: 128px;
height: 1px;"/></td>
<td><img alt="" src="test.html_files/px" style="width: 419px;
height: 1px;"/></td>
</tr>
<tr valign="top">
<td colspan="3"><img alt="" src="test.html_files/px" style="width:
595px; height: 160px;"/></td>
</tr>
<tr valign="top">
<td><img alt="" src="test.html_files/px" style="width: 48px; height:
16px;"/></td>
<td style="border-top-style: solid; border-top-width: 2px; border-
top-color: #000000; border-left-style: solid; border-left-width: 2px;
border-left-color: #000000; border-bottom-style: solid; border-bottom-
width: 2px; border-bottom-color: #000000; border-right-style: solid;
border-right-width: 2px; border-right-color: #000000; "><span
style="font-family: sansserif; font-size: 10.0px;">some test 1</span></
td>
<td><img alt="" src="test.html_files/px" style="width: 419px;
height: 16px;"/></td>
</tr>
<tr valign="top">
<td colspan="3"><img alt="" src="test.html_files/px" style="width:
595px; height: 4px;"/></td>
</tr>
<tr valign="top">
<td><img alt="" src="test.html_files/px" style="width: 48px; height:
16px;"/></td>
<td style="border-top-style: solid; border-top-width: 2px; border-
top-color: #000000; border-left-style: solid; border-left-width: 2px;
border-left-color: #000000; border-bottom-style: solid; border-bottom-
width: 2px; border-bottom-color: #000000; border-right-style: solid;
border-right-width: 2px; border-right-color: #000000; "><span
style="font-family: sansserif; font-size: 10.0px;">some test 2</span></
td>
<td><img alt="" src="test.html_files/px" style="width: 419px;
height: 16px;"/></td>
</tr>
<tr valign="top">
<td colspan="3"><img alt="" src="test.html_files/px" style="width:
595px; height: 646px;"/></td>
</tr>
</table>
</td><td width="50%"> </td></tr>
</table>
</body>
</html>