CSSLayout + Iframe

**fmrock** · 10-11-2007, 02:31 PM

Hey everyone, I have a full css layout and have removed the activeX control that was in the Chart Div. And put an IFRAME into that div. But now the IFRAME is moved way below the form and where it should be.

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
html {
    margin: 0px;
    padding: 0px;
    margin-left:0px;
    margin-right:0px;
    margin-bottom:0px;
    margin-top:0px;
    height:100%;
    }

body {
    margin:0px 0px 0px 0px;
    height: 100%;
    font-family:Arial, Helvetica, sans-serif;
    font-size: 12px;
    }  

.Chart {
    margin-left: 0px;
    margin-right: 305px;
    height: 99%; 
    border:solid;
    border-width:2px; 
    }

.AddendumForm {
    float: right;
    padding: 0px 0px 0px 0px;
    width: 305px;
    height: 99%;  
    border:solid;
    border-width:2px;
    }
.AddendumForm form{
    height:98%;
	height: expression(document.documentElement.clientHeight*0.98-300+'px');	
    margin: 0px;
    padding: 0px;
    margin-left:0px;
    margin-right:0px;
    margin-bottom:0px;
    margin-top:0px;
    }

.AddendumForm textarea{
	width: 98%;
	height:98%;
	height: expression(document.documentElement.clientHeight*0.98-300+'px');	
    margin: 0px;
    padding: 0px;
    margin-left:0px;
    margin-right:0px;
    margin-bottom:0px;
    margin-top:0px;
	background-color:#FFFFCC;
	}

.container {
    height: 100%;     
    }
.warning {
	color: black;
	font-weight: bold;
	font-size: large;
	border:solid;
	border-style:solid;
	border-width:thin;
	border-color:#FF0000;
	background-color:#CCCCCC;	
	width:50%;
	heigth:50%;
	margin: 50px 50px 50px 50px;
	text-align:center;
}


.Addendum_already_added {
	color: #FF0000;
	font-weight: bold;
}

.chartloading {
 	width: 300px;
 	height: 200px;
 	background-color: #CCCCCC;
 	position: absolute;
 	left: 50%;
 	top: 50%;
 	margin-top: -100px;
 	margin-left: -150px;
 	text-align: center;
	border-style:solid;
	border-width:thin;
	border-color:#000000;
	display:none;

}

</style>
<style type="text/css" media="print">
div#container {
     display:none
}

div#AddendumForm {
     display:none
}

div#Chart {
     display:none
}

object{
	display:none;
}
</style>



</head>


<div class="container">
    <div class="AddendumForm" id="AddendumForm"></div>
    <div class="Chart" id="Chart"><iframe height="100%"  width="100%" src="test.pdf">If you can see this, your browser doesn't understand IFRAME</iframe></div>
</div>
</body>
</html>

**fmrock** · 10-11-2007, 02:33 PM

I forgot to mention, that this works in IE, but need it to work in Safari/Firefox also.. that is where it is added below it should be

**fmrock** · 10-11-2007, 03:20 PM

If i set the IFRAME to be 98% height and width, it puts the ifram where it should.

Thread: CSSLayout + Iframe

Thread Tools

Search Thread

CSSLayout + Iframe

Bookmarks

Bookmarks

Posting Permissions