Solved

how to fix Internet Explorer box model bug

Posted on 2009-07-08
14
1,276 Views
Last Modified: 2013-12-08
Hi Experts,

               I have a page which has a small toolbar and an Iframe. Somehow I am getting a weird white space between the header and the rendered Iframe (Chart in the snap shot).
              An expert here on EE told me about box model bug and that it can be be fixed by DOCTYPE declaration. Luckily It got fixed but only on IE7, I want it to work on IE6.
         
               Can you please suggest me a way to get rid of this white space? I have attached my code, snapshot and stylesheets used in this page
<%@page  language="java" import="java.sql.*" errorPage=""%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
 "http://www.w3.org/TR/html4/loose.dtd">
 
<html>
<head>
<title>View Detail</title>
 
<script type="text/javascript" src="/analytics/static/zoom/jquery.js"></script>
<script type="text/javascript" src="/analytics/static/zoom/thickbox.js"></script>
<link rel="stylesheet" href="/analytics/static/zoom/thickbox.css" type="text/css" media="screen" />
 
<style type="text/css">
        @import url("/analytics/static/styles/intranet.css");             /* main stylesheet */
        @import url("/analytics/static/styles/intranet-2col.css");        /* column stylesheet */
        @import url("/analytics/static/styles/intranet-2col-1024.css");   /* 1024px stylesheet */
</style>
<link rel="shortcut icon" href="../jsp/favicon.icon" />
</head>
 
<body>
<div id="page-wrapper"><%@include file="Header.jsp"%>
<div id="column-wrapper"><!-- begin columns --> 
<%@include file="NEW_TOOLBAR.jsp"%>
 
<div id="content"><!-- begin content column -->
<div class="inner">
 
<iframe src="chart.html?chartType=${detailForm.chartType}&chartGroup=${detailForm.chartGroup}&chartSubgroup=${detailForm.chartSubgroup}&liabilityCode=IRU&timeline=${detailForm.timeline}&width=600&height=400" frameborder="0" scrolling="no" width="700" height="430" align="top"></iframe>
 
 
<!-- end content column, then column wrapper --></div>
</div>
<%@include file="Footer.jsp"%></div>
 
</body>
</html>

Open in new window

intranet.txt
intranet-2col.txt
intranet-2col-1024.txt
whitespace.JPG
0
Comment
Question by:aman0711
  • 7
  • 6
14 Comments
 
LVL 19

Expert Comment

by:NerdsOfTech
ID: 24808686
post NEW_TOOLBAR.jsp also thanks
0
 
LVL 19

Expert Comment

by:NerdsOfTech
ID: 24808698
post OUTPUT page source too.
0
 
LVL 10

Author Comment

by:aman0711
ID: 24808741
Hi NerdsofTech..

                 Here is the NEW_TOOLBAR.jsp


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<html>
<head>
<style type="text/css">
		     @import url("/analytics/static/calendar/mystyle.css");
.tofrom {
        height:18px;
        float:left;
        width:40px;
        padding-top:3px;
}
.calimg {
        margin:1px 0 0 0;
        float:left;
        width:28px;
}
</style>
<script type="text/javascript" src="/analytics/static/calendar/ashscript1.js"></script>
<!--[if IE]>
<style type="text/css"> 
.tofrom { padding-top:4px; }
.calimg { margin:3px 0 0 0; }
</style>
<![endif]-->
 <style type="text/css" media="screen">   
  	@import url("<c:url value="/resources/dojo/resources/dojo.css"/>");
  	@import url("<c:url value="/resources/dijit/themes/tundra/tundra.css"/>");
    @import url("<c:url value="/static/styles/roo.css"/>");
  </style>     
  
  <script djconfig="parseOnLoad: true" src="<c:url value="/resources/dojo/dojo.js"/>" type="text/javascript"></script>
  <script type="text/javascript" src="<c:url value="/resources/spring/Spring.js" />"> </script>
  <script type="text/javascript" src="<c:url value="/resources/spring/Spring-Dojo.js" />"> </script>	 
	<script type="text/javascript">
	dojo.require("dojo.parser");
  </script>
 
<script type="text/javascript" src="/analytics/static/zoom/jquery.js"></script>
<script type="text/javascript" src="/analytics/static/js/jquery.selectboxes.js"></script>
 
<script type="text/javascript">	    
 
	// register listener on chartGroup select
    	
	$(document).ready(function() {
 
		// call loadSubGroups() when chartGroup value changes
		
		$("#chartGroup").bind('change', loadSubgroups);                   
	});   
 
	// Set up chartSubgroup select lists
	
	var map = ${chartSubgroups};
    			
	// When a make is selected, populate the models dropdown
 
	function loadSubgroups() {
 
		// empty the chartSubgroup
		
		$("#chartSubgroup").removeOption(/./);
 
		// get the selected chart group
		
		group = $("#chartGroup").selectedValues()[0];
 
		// And the coresponding subgroups
		
		subgroups = map[group];
 
		// And add the option to the subgroup select
		
		for(subgroupId in subgroups) {
			subgroup = subgroups[subgroupId];
			$("#chartSubgroup").addOption(subgroup, subgroup); // Value, Text
		}
	}		
   
    </script>
 
 
</head>
<body onload="loadSubgroups();">
 <div id="right-col">
<!-- begin right column -->
<div class="sidebar-panel" style="border:5px solid #99CCFF; width:145px; padding:2px; background:white;">
 
 <form:form commandName="detailForm" method="GET">
<div style="font-weight:bold; color:#000">Report Group:</div>
<div align="center" style="margin:0 0 5px 0; ">
<div style="margin:0 0 5px 0;"><form:select path="chartGroup" items="${chartGroups}" /></div>
</div>
 
<div style="font-weight:bold; color:#000">Report SubGroup:</div>
<div align="center" style="margin:0 0 5px 0; ">
<div style="margin:0 0 5px 0;"><form:select path="chartSubgroup" items="${chartSubgroups}" /></div>
</div>
 
<div style="font-weight:bold; color:#000">Chart Type:</div>
<div align="center" style="margin:0 0 5px 0; ">
<div style="margin:0 0 5px 0;"><form:select path="chartType" items="${chartTypes}" id="ct"/></div>
</div>
 
<div style="font-weight:bold; color:#000">Timeline</div>
<div align="center" style="margin:0 0 5px 0; ">
<div style="margin:0 0 5px 0;"><form:select path="timeline" items="${timelines}" id="tm"/></div>
</div>
 
<div style="color:black;">
<div class="tofrom">From:</div>
<div class="calimg"><img src="/analytics/static/images/CAL.PNG" name="Calendar" width="18" height="18" id="Calendar" onClick="displayDatePicker('from_date');" /></div>
<form:input path="startDt" id="from_date" size="7" maxlength="8" />
</div>
<div style="color:black;">
<div class="tofrom">To:</div>
<div class="calimg"><img name="Calendar" src="/analytics/static/images/CAL.PNG" width="18" height="18" id="Calendarm" onClick="displayDatePicker('to_date');" /> </div>
<form:input path="endDt" id="to_date" size="7" maxlength="8" />
</div>
 
<div style="font-weight:bold; color:#000">Customer Type</div>
<div align="center" style="margin:0 0 5px 0; ">
<div style="margin:0 0 5px 0;"><form:select path="liabilityCode" items="${liabilityCodes}" id="tm"/></div>
</div>
 
 
 
<h5 style="padding:0 30px 10px 0; font-size:9px; font-wight:lighter; background:white; ">
<div style="width:40px; font-size:.8em; font-weight:lighter;">
<input type="submit" value="Update Chart" />
</div>
</h5>
 
<div style="clear:both;"></div>
</form:form>
<!-- end right column, then column-wrapper -->
</div>
</div>
</body>
</html>

Open in new window

0
Does Powershell have you tied up in knots?

Managing Active Directory does not always have to be complicated.  If you are spending more time trying instead of doing, then it's time to look at something else. For nearly 20 years, AD admins around the world have used one tool for day-to-day AD management: Hyena. Discover why

 
LVL 10

Author Comment

by:aman0711
ID: 24808747
and this is the HTML output

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html>
<head>
<title>View Detail</title>
 
<script type="text/javascript" src="/analytics/static/zoom/jquery.js"></script>
<script type="text/javascript" src="/analytics/static/zoom/thickbox.js"></script>
<link rel="stylesheet" href="/analytics/static/zoom/thickbox.css" type="text/css" media="screen" />
 
<style type="text/css">
        @import url("/analytics/static/styles/intranet.css");             /* main stylesheet */
        @import url("/analytics/static/styles/intranet-2col.css");        /* column stylesheet */
        @import url("/analytics/static/styles/intranet-2col-1024.css");   /* 1024px stylesheet */
    
  iframe { vertical-align:top; }
       
</style>
 
 
 
 
<link rel="shortcut icon" href="../jsp/favicon.icon" />
</head>
 
<body>
<div id="page-wrapper"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 
<head>
 
 
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
 
<link rel="stylesheet" type="text/css" href="/analytics/static/styles/2leveltab.css" />
 
<script type="text/javascript" src="/analytics/static/js/2leveltab.js">
 
/***********************************************
* 2 level Horizontal Tab Menu- by JavaScript Kit (www.javascriptkit.com)
* This notice must stay intact for usage
* Visit JavaScript Kit at http://www.javascriptkit.com/ for full source code
***********************************************/
 
</script>
 
</head>
 
<body>
 
<div id="page-wrapper">
 
<div id="header"><!-- begin header -->
 
<h1 class="hidden">Intranet Site</h1>
<!-- hidden titles for accessibility and SEO -->
<h2 class="hidden">Intranet Site Homepage</h2>
 
<h1 id="title"><a href="index.html" title=" Intranet Home"><img
	alt="" src="/analytics/static/images/header-title.jpg" /></a></h1>
 
<ul id="maintab" class=" nav-bar">
	<li class="current"><a href="index.html" title="Home">SUMMARY</a></li>
	<li>KPI</li>
	<li>TRANSACTION</li>
	<li>ERRORS</li>
	<li>REVENUE</li>
	<li>CALL OFFLOAD</li>
	<li rel="admin"><a href="admin.html" title="Admin Console">ADMIN</a></li>
	<li><a href="mailto:g01151@att.com?subject=MyWorld Analytics Portal">CONTACT US</a></li>
</ul>
 
 
<script type="text/javascript">
//initialize tab menu, by passing in ID of UL
initalizetab("maintab");
</script>
 
<!-- end header --></div>
</div>
<div id="admin" class="submenustyle">
<a href="admin.html?page=admDefault" title="" style='text-decoration: none;'>Default Views</a>
<a href="adminEdit.html?page=editAdmSummary" title="" style='text-decoration: none;'>Add/Edit Defaults</a>
<a href="goal.html?page=goal" title="" style='text-decoration: none;'>Goals Summary</a>
<a href="goalEdit.html?page=editGoal" title="" style='text-decoration: none;'>Add/Edit Goal</a>
</div>
</body>
</html>
<div id="column-wrapper"><!-- begin columns --> 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 
 
 
 
<html>
<head>
<style type="text/css">
		     @import url("/analytics/static/calendar/mystyle.css");
.tofrom {
        height:18px;
        float:left;
        width:40px;
        padding-top:3px;
}
.calimg {
        margin:1px 0 0 0;
        float:left;
        width:28px;
}
</style>
<script type="text/javascript" src="/analytics/static/calendar/ashscript1.js"></script>
<!--[if IE]>
<style type="text/css"> 
.tofrom { padding-top:4px; }
.calimg { margin:3px 0 0 0; }
</style>
<![endif]-->
 <style type="text/css" media="screen">   
  	@import url("/analytics/resources/dojo/resources/dojo.css");
  	@import url("/analytics/resources/dijit/themes/tundra/tundra.css");
    @import url("/analytics/static/styles/roo.css");
  </style>     
  
  <script djconfig="parseOnLoad: true" src="/analytics/resources/dojo/dojo.js" type="text/javascript"></script>
  <script type="text/javascript" src="/analytics/resources/spring/Spring.js"> </script>
  <script type="text/javascript" src="/analytics/resources/spring/Spring-Dojo.js"> </script>	 
	<script type="text/javascript">
	dojo.require("dojo.parser");
  </script>
 
<script type="text/javascript" src="/analytics/static/zoom/jquery.js"></script>
<script type="text/javascript" src="/analytics/static/js/jquery.selectboxes.js"></script>
 
<script type="text/javascript">	    
 
	// register listener on chartGroup select
    	
	$(document).ready(function() {
 
		// call loadSubGroups() when chartGroup value changes
		
		$("#chartGroup").bind('change', loadSubgroups);                   
	});   
 
	// Set up chartSubgroup select lists
	
	var map = {"Registration":["REGISTRATION"],"UpgradeChanges":["UPGRADE_CHANGE"],"Payment":["AUTOPAY","TXT2PAY"]};
    			
	// When a make is selected, populate the models dropdown
 
	function loadSubgroups() {
 
		// empty the chartSubgroup
		
		$("#chartSubgroup").removeOption(/./);
 
		// get the selected chart group
		
		group = $("#chartGroup").selectedValues()[0];
 
		// And the coresponding subgroups
		
		subgroups = map[group];
 
		// And add the option to the subgroup select
		
		for(subgroupId in subgroups) {
			subgroup = subgroups[subgroupId];
			$("#chartSubgroup").addOption(subgroup, subgroup); // Value, Text
		}
	}		
   
    </script>
 
 
</head>
<body onload="loadSubgroups();">
 <div id="right-col">
<!-- begin right column -->
<div class="sidebar-panel" style="border:5px solid #99CCFF; width:145px; padding:2px; background:white;">
 
 <form id="detailForm" action="/analytics/chartDetail.html?chartType=line&amp;chartGroup=View/Change%20Rate%20Plan&amp;chartSubgroup=CHANGE_RATE_PLAN_FIN_SUB&amp;liabilityCode=CRU&amp;timeline=Monthly&amp;width=750&amp;height=375" method="GET">
<div style="font-weight:bold; color:#000">Report Group:</div>
<div align="center" style="margin:0 0 5px 0; ">
<div style="margin:0 0 5px 0;"><select id="chartGroup" name="chartGroup"><option value="Registration">Registration</option><option value="UpgradeChanges">UpgradeChanges</option><option value="Payment">Payment</option></select></div>
</div>
 
<div style="font-weight:bold; color:#000">Report SubGroup:</div>
<div align="center" style="margin:0 0 5px 0; ">
<div style="margin:0 0 5px 0;"><select id="chartSubgroup" name="chartSubgroup"><option value="Registration">[&quot;REGISTRATION&quot;]</option><option value="UpgradeChanges">[&quot;UPGRADE_CHANGE&quot;]</option><option value="Payment">[&quot;AUTOPAY&quot;,&quot;TXT2PAY&quot;]</option></select></div>
</div>
 
<div style="font-weight:bold; color:#000">Chart Type:</div>
<div align="center" style="margin:0 0 5px 0; ">
<div style="margin:0 0 5px 0;"><select id="ct" name="chartType"><option value="bar">bar</option><option value="line" selected="selected">line</option></select></div>
</div>
 
<div style="font-weight:bold; color:#000">Timeline</div>
<div align="center" style="margin:0 0 5px 0; ">
<div style="margin:0 0 5px 0;"><select id="tm" name="timeline"><option value="Daily">Daily</option><option value="Weekly">Weekly</option><option value="Monthly" selected="selected">Monthly</option><option value="Quarterly">Quarterly</option><option value="Annual">Annual</option></select></div>
</div>
 
<div style="color:black;">
<div class="tofrom">From:</div>
<div class="calimg"><img src="/analytics/static/images/CAL.PNG" name="Calendar" width="18" height="18" id="Calendar" onClick="displayDatePicker('from_date');" /></div>
<input id="from_date" name="startDt" type="text" value="" size="7" maxlength="8"/>
</div>
<div style="color:black;">
<div class="tofrom">To:</div>
<div class="calimg"><img name="Calendar" src="/analytics/static/images/CAL.PNG" width="18" height="18" id="Calendarm" onClick="displayDatePicker('to_date');" /> </div>
<input id="to_date" name="endDt" type="text" value="" size="7" maxlength="8"/>
</div>
 
<div style="font-weight:bold; color:#000">Customer Type</div>
<div align="center" style="margin:0 0 5px 0; ">
<div style="margin:0 0 5px 0;"><select id="tm" name="liabilityCode"><option value="IRU">IRU</option><option value="CRU" selected="selected">CRU</option></select></div>
</div>
 
 
 
<h5 style="padding:0 30px 10px 0; font-size:9px; font-wight:lighter; background:white; ">
<div style="width:40px; font-size:.8em; font-weight:lighter;">
<input type="submit" value="Update Chart" />
</div>
</h5>
 
<div style="clear:both;"></div>
</form>
<!-- end right column, then column-wrapper -->
</div>
</div>
</body>
</html>
 
<div id="content"><!-- begin content column -->
<div class="inner">
 
<iframe src="chart.html?chartType=line&chartGroup=View/Change Rate Plan&chartSubgroup=CHANGE_RATE_PLAN_FIN_SUB&liabilityCode=IRU&timeline=Monthly&width=600&height=400" frameborder="0" scrolling="no" width="700" height="430" align="top"></iframe>
 
 
<table width="755" cellpadding="3" cellspacing="4" border="0">
<tr><td valign="top" style="text-align:left; padding-left:5px;">
<a href="chart.html?chartType=line&chartGroup=View/Change Rate Plan&chartSubgroup=CHANGE_RATE_PLAN_FIN_SUB&liabilityCode=IRU&timeline=Monthly&startDt=&endDt=&width=750&height=375&KeepThis=true&TB_iframe=true&height=450&width=745" style='text-decoration: none;' class="thickbox">
Zoom Chart</a>
</td>
 
<td valign="top" style="text-align:left; padding-left:5px;">
<a href="chartCaveat.html?chartId=0&KeepThis=true&height=350&width=450" class="thickbox"  style='text-decoration: none;'>
Chart Caveat</a>
</td>
<td> &nbsp;</td>
</tr>
 
<tr>
<td valign="top" style="text-align:left; padding-left:5px;">
From: 
</td>
<td>
To: 
</td>
<td valign="top" style="text-align:left; padding-left:5px;">
Data Source:eDM
</td>
</tr>
 
</table>
 
<form id="detailForm" action="/analytics/chartDetail.html?chartType=line&amp;chartGroup=View/Change%20Rate%20Plan&amp;chartSubgroup=CHANGE_RATE_PLAN_FIN_SUB&amp;liabilityCode=CRU&amp;timeline=Monthly&amp;width=750&amp;height=375" method="post">
 <table>
 <tr>
   <td>&nbsp;</td><td>&nbsp;</td><td><input type="submit" value="Back" align="right"></td>
</tr>  
 </table>
 
   </form>
 
<hr />
 
<br />
 
<table class="table-style" border="1" cellspacing="1" bgcolor="#FFFFFF" width=93%><tr><th>Metrics</th><th>09-02</th><th>09-03</th><th>09-04</th><th>09-05</th><th>09-06</th></tr><tr><td>Change Rate Plan Final Submit</td><td>17</td><td>19</td><td>13</td><td>9</td><td>6</td></tr></Table>
 
<br />
 
 
<!-- end content column, then column wrapper --></div>
</div>
<div id="footer-wrapper"><!-- begin footer -->
 
<div id="footer">
 
<ul class="nav-bar">
	<li><a href="#" title="Intranet Home">Home</a></li>
	  <li><a href="http://siweb.it.att.com" title="MyIntranet Home">SIWEB Portal</a></li>    
</ul>
 
<p class="text">&copy; All Rights Reserved.</p>
 
<!-- end footer, then page-wrapper --></div>
</div>
</div>
</body>
</html>

Open in new window

0
 
LVL 19

Expert Comment

by:NerdsOfTech
ID: 24808749
try css positioning
<%@page  language="java" import="java.sql.*" errorPage=""%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
 "http://www.w3.org/TR/html4/loose.dtd">
 
<html>
<head>
<title>View Detail</title>
 
<script type="text/javascript" src="/analytics/static/zoom/jquery.js"></script>
<script type="text/javascript" src="/analytics/static/zoom/thickbox.js"></script>
<link rel="stylesheet" href="/analytics/static/zoom/thickbox.css" type="text/css" media="screen" />
 
<style type="text/css">
        @import url("/analytics/static/styles/intranet.css");             /* main stylesheet */
        @import url("/analytics/static/styles/intranet-2col.css");        /* column stylesheet */
        @import url("/analytics/static/styles/intranet-2col-1024.css");   /* 1024px stylesheet */
</style>
<link rel="shortcut icon" href="../jsp/favicon.icon" />
</head>
 
<body>
<div id="page-wrapper"><%@include file="Header.jsp"%>
<div id="column-wrapper"><!-- begin columns --> 
<%@include file="NEW_TOOLBAR.jsp"%>
 
<div id="content"><!-- begin content column -->
<div class="inner" style="position:relative; top: 0px; left: 0px;">
 
<iframe src="chart.html?chartType=${detailForm.chartType}&chartGroup=${detailForm.chartGroup}&chartSubgroup=${detailForm.chartSubgroup}&liabilityCode=IRU&timeline=${detailForm.timeline}&width=600&height=400" frameborder="0" scrolling="no" width="700" height="430" align="top"></iframe>
 
 
<!-- end content column, then column wrapper --></div>
</div>
<%@include file="Footer.jsp"%></div>
 
</body>
</html>

Open in new window

0
 
LVL 19

Expert Comment

by:NerdsOfTech
ID: 24808786
Thanks for the uploads.

It looks like your .js is posting new headers and <html> tags...
Is there a way to save that as a new file, link, and remove the html and body tags, etc.

This may be creating that gap.

0
 
LVL 10

Author Comment

by:aman0711
ID: 24808795
Thanks for your Help :)

>> It looks like your .js is posting new headers and <html> tags...
Is there a way to save that as a new file, link, and remove the html and body tags, etc


I didnt get you, where exactly? :)
0
 
LVL 10

Author Comment

by:aman0711
ID: 24808804
>> style="position:relative; top: 0px; left: 0px;"

Didnt work :(
0
 
LVL 19

Accepted Solution

by:
NerdsOfTech earned 400 total points
ID: 24808906
Replying to #ID: 24808795

The .js script that is posting before your iframe is outputing its own <html></html> tags

If you were to remove these from the file...save it as another file..."link" the new file...that may eliminate that gap..

Another Idea would be to create a table and <td> the iframe... try:
<%@page  language="java" import="java.sql.*" errorPage=""%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
 "http://www.w3.org/TR/html4/loose.dtd">
 
<html>
<head>
<title>View Detail</title>
 
<script type="text/javascript" src="/analytics/static/zoom/jquery.js"></script>
<script type="text/javascript" src="/analytics/static/zoom/thickbox.js"></script>
<link rel="stylesheet" href="/analytics/static/zoom/thickbox.css" type="text/css" media="screen" />
 
<style type="text/css">
        @import url("/analytics/static/styles/intranet.css");             /* main stylesheet */
        @import url("/analytics/static/styles/intranet-2col.css");        /* column stylesheet */
        @import url("/analytics/static/styles/intranet-2col-1024.css");   /* 1024px stylesheet */
</style>
<link rel="shortcut icon" href="../jsp/favicon.icon" />
</head>
 
<body>
 
<table>
<tr>
<td>
 <div id="content"><!-- begin content column -->
  <div class="inner">
   <iframe src="chart.html?chartType=${detailForm.chartType}&chartGroup=${detailForm.chartGroup}&chartSubgroup=${detailForm.chartSubgroup}&liabilityCode=IRU&timeline=${detailForm.timeline}&width=600&height=400" frameborder="0" scrolling="no" width="700" height="430" align="top"></iframe>
  </div>
  <!-- end content column, then column wrapper -->
 </div>
</td>
<td>
 <div id="page-wrapper"><%@include file="Header.jsp"%>
  <div id="column-wrapper"><!-- begin columns --> 
   <%@include file="NEW_TOOLBAR.jsp"%>
  </div>
 </div>
</td>
</tr>
</table>
 
<%@include file="Footer.jsp"%>
 
</body>
</html>

Open in new window

0
 
LVL 10

Author Comment

by:aman0711
ID: 24808946
Didnt work :(

Actually the multiple tags you are seeing is coming from Header and New tool bar.jsp...

I dont understand, why only this page is getting messed up :(
0
 
LVL 19

Assisted Solution

by:NerdsOfTech
NerdsOfTech earned 400 total points
ID: 24809033
Ok lets try CSS again

try:
<%@page  language="java" import="java.sql.*" errorPage=""%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
 "http://www.w3.org/TR/html4/loose.dtd">
 
<html>
<head>
<title>View Detail</title>
 
<script type="text/javascript" src="/analytics/static/zoom/jquery.js"></script>
<script type="text/javascript" src="/analytics/static/zoom/thickbox.js"></script>
<link rel="stylesheet" href="/analytics/static/zoom/thickbox.css" type="text/css" media="screen" />
 
<style type="text/css">
        @import url("/analytics/static/styles/intranet.css");             /* main stylesheet */
        @import url("/analytics/static/styles/intranet-2col.css");        /* column stylesheet */
        @import url("/analytics/static/styles/intranet-2col-1024.css");   /* 1024px stylesheet */
</style>
<link rel="shortcut icon" href="../jsp/favicon.icon" />
</head>
 
<body>
<div id="page-wrapper"><%@include file="Header.jsp"%>
<div id="column-wrapper"><!-- begin columns --> 
<%@include file="NEW_TOOLBAR.jsp"%>
 
<div id="content"><!-- begin content column -->
<div class="inner" style="position:relative; top: 0px; left: 0px; float: left">
 
<iframe style="position:relative; top: 0px; left: 0px; float: left" src="chart.html?chartType=${detailForm.chartType}&chartGroup=${detailForm.chartGroup}&chartSubgroup=${detailForm.chartSubgroup}&liabilityCode=IRU&timeline=${detailForm.timeline}&width=600&height=400" frameborder="0" scrolling="no" width="700" height="430" align="top"></iframe>
 
 
<!-- end content column, then column wrapper --></div>
</div>
<%@include file="Footer.jsp"%></div>
 
</body>
</html>

Open in new window

0
 
LVL 10

Author Comment

by:aman0711
ID: 24815395
Didnt work either :(
So strange... ..... it neevr happened to me before
0
 
LVL 92

Assisted Solution

by:objects
objects earned 100 total points
ID: 24822481
> Actually the multiple tags you are seeing is coming from Header and New tool bar.jsp...

get rid of them, they shouldn't be there
0
 
LVL 10

Author Comment

by:aman0711
ID: 25844432
please replace the attached snapshot with the one attached below
and please delete the 3 files attached (Those are not required for the fix.)

whitespace.JPG
0

Featured Post

Efficient way to get backups off site to Azure

This user guide provides instructions on how to deploy and configure both a StoneFly Scale Out NAS Enterprise Cloud Drive virtual machine and Veeam Cloud Connect in the Microsoft Azure Cloud.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Why do we like using grid based layouts in website design? Let's look at the live examples of websites and compare them to grid based WordPress themes.
Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…

832 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question