cadenuo
26 Feb 2011, 10:36 PM
hey there its the new guy again having an issue with a div with IE 7 firefox works great but IE moves it all over the place to the point you cant even see it on the screen here is the html
<!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">
<head>
<title>Heavenly Reflections Web & Graphic Design</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="reset.css" rel="stylesheet" type="text/css" />
<link href="content.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>
<body onload="MM_preloadImages('images/hr_home_btn_roll.png','images/hr_portfolio_btn_roll.png','images/hr_services_btn_roll.png','images/hr_contact_btn_roll.png')">
<div id="wrapper">
<div id="header">
<img src="images/HeavenlyReflectionsnew_01.png" width="1024" height="132" border="0" class="header_01" /><!--
--><a href="heavenlyreflections.html"><!--
--><img src="images/hr_logo_btn.png" width="429" height="299" border="0" class="logo_btn" /></a><!--
--><ul id="m_list"><!--
--><li id="home"><a href="heavenlyreflections.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('home_btn','','images/hr_home_btn_roll.png',1)"><img src="images/hr_home_btn.png" alt="home" name="home_btn" width="129" height="78" border="0" id="home_btn" /></a></li><!--
--><li id="portfolio"><a href="portfolio.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('portfolio_btn','','images/hr_portfolio_btn_roll.png',1)"><img src="images/hr_portfolio_btn.png" alt="portfolio" name="portfolio_btn" width="152" height="78" border="0" id="portfolio_btn" /></a></li><!--
--><li id="services"><a href="services.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('services_btn','','images/hr_services_btn_roll.png',1)"><img src="images/hr_services_btn.png" alt="services" name="services_btn" width="148" height="78" border="0" id="services_btn" /></a></li><!--
--><li id="contact"><a href="contact.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('contact_btn','','images/hr_contact_btn_roll.png',1)"><img src="images/hr_contact_btn.png" alt="contact" name="contact_btn" width="166" height="78" border="0" id="contact_btn" /></a></li><!--
--></ul><!--
--><img src="images/HeavenlyReflectionsnew_07.png" width="595" height="221" border="0" class="header_02" />
</div>
<div id="form">
<div id="comments_box" align="center">
<form action="contact.php" method="post">
<fieldset class="comment_box">
<font size="32" color="#ffffff"><h4>Contact Us</h4></font>
<label class="labelone" for="name" >Name:</label>
<input id="labelone" name="name" type="text" size="50" maxlength="50" />
<label for="subject">Subject:: </label>
<input name="subject" type="text" size="50" maxlength="50" />
<label for="email">Email: </label>
<input name="email" type="text" size="50" maxlength="50" />
<label for="comments">Comments:</label>
<textarea name="comments" cols="50" rows="15"></textarea>
</fieldset>
<fieldset class="send_btn">
<button class="btn" name="send"/>
</fieldset>
</form>
</div>
<div id="letter">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="600" height="50" id="letter_fly" align="center">
<param name="movie" value="letter_fly.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#333333" />
<param name="play" value="true" />
<param name="loop" value="false" />
<param name="wmode" value="transparent" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="letter_fly.swf" width="600" height="50" align="center">
<param name="movie" value="letter_fly.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#333333" />
<param name="play" value="true" />
<param name="loop" value="false" />
<param name="wmode" value="transparent" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--<![endif]-->
<a href="http://www.adobe.com/go/getflash">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
<div id="footer">
<img src="images/footer.png" width="1024" height="200" class="footer" />
</div>
</div>
<!-- End Save for Web Slices -->
</body>
</html>
and the css
@charset "utf-8";
html
{
}
body
{
margin:0;
padding:0;
height:100%;
}
* html body
{
height: 100%;
}
#wrapper
{
position:relative;
background-color:#f5f5f5;
margin-left:-512px;
left:50%;
width:1024px;
border:none;
padding:0;
min-height: 100%;
height: auto !important;
height: 100%;
margin-bottom:-200px;
}
#header
{
}
.header_01
{
}
img.logo_btn
{
float: left;
border:none;
z-index:10;
}
li
{
height: 78px;
padding: 0 !important;
margin: 0 !important;
overflow: hidden;
}
#m_list li
{
display:block;
float:left;
}
* html #m_list li
{
display:inline; /* for IE 6 */
}
* + html #m_list li
{
display:inline; /* for IE 7 */
}
.header_02
{
}
#form
{
padding:10px;
padding-bottom:200px;
}
.comments_box
{
}
div #comments_box
{
height:555px;
width:514px;
background-image:url(images/contact.png);
background-repeat:no-repeat;
}
#comments_box
{
margin:2em auto 0 auto;
padding:4em 0 2em 0;
}
form
{
width:514px;
height:17px;
margin-top: -40px;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
}
label
{
z-index:10;
display:block;
}
fieldset
{
border:none;
}
.send_btn
{
border:none;
width:166px;
height:49px;
}
.btn
{
margin-top:20px;
border:none;
width:166px;
height:49px;
background-image:url(images/contact_btn.jpg);
background-repeat:no-repeat;
background-color:transparent;
}
.btn:hover
{
border:none;
width:166px;
height:49px;
background-image:url(images/contact_btn_roll.jpg);
background-repeat:no-repeat;
background-color:transparent;
}
#letter
{
height:50px;
width:600px;
}
#letter_fly
{
position:absolute;
margin-top:-626px;
margin-left:-200px;
}
#footer
{
position:absolute;
bottom:0;
width:100%;
bottom:0px;
height:200px;
left:50%;
margin-left:-512px;
width:1024px;
}
the #letter_fly id is the id im useing to position my flash again its perfect on firefox but IE pos is all out of wack thx for any help
<!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">
<head>
<title>Heavenly Reflections Web & Graphic Design</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="reset.css" rel="stylesheet" type="text/css" />
<link href="content.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>
<body onload="MM_preloadImages('images/hr_home_btn_roll.png','images/hr_portfolio_btn_roll.png','images/hr_services_btn_roll.png','images/hr_contact_btn_roll.png')">
<div id="wrapper">
<div id="header">
<img src="images/HeavenlyReflectionsnew_01.png" width="1024" height="132" border="0" class="header_01" /><!--
--><a href="heavenlyreflections.html"><!--
--><img src="images/hr_logo_btn.png" width="429" height="299" border="0" class="logo_btn" /></a><!--
--><ul id="m_list"><!--
--><li id="home"><a href="heavenlyreflections.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('home_btn','','images/hr_home_btn_roll.png',1)"><img src="images/hr_home_btn.png" alt="home" name="home_btn" width="129" height="78" border="0" id="home_btn" /></a></li><!--
--><li id="portfolio"><a href="portfolio.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('portfolio_btn','','images/hr_portfolio_btn_roll.png',1)"><img src="images/hr_portfolio_btn.png" alt="portfolio" name="portfolio_btn" width="152" height="78" border="0" id="portfolio_btn" /></a></li><!--
--><li id="services"><a href="services.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('services_btn','','images/hr_services_btn_roll.png',1)"><img src="images/hr_services_btn.png" alt="services" name="services_btn" width="148" height="78" border="0" id="services_btn" /></a></li><!--
--><li id="contact"><a href="contact.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('contact_btn','','images/hr_contact_btn_roll.png',1)"><img src="images/hr_contact_btn.png" alt="contact" name="contact_btn" width="166" height="78" border="0" id="contact_btn" /></a></li><!--
--></ul><!--
--><img src="images/HeavenlyReflectionsnew_07.png" width="595" height="221" border="0" class="header_02" />
</div>
<div id="form">
<div id="comments_box" align="center">
<form action="contact.php" method="post">
<fieldset class="comment_box">
<font size="32" color="#ffffff"><h4>Contact Us</h4></font>
<label class="labelone" for="name" >Name:</label>
<input id="labelone" name="name" type="text" size="50" maxlength="50" />
<label for="subject">Subject:: </label>
<input name="subject" type="text" size="50" maxlength="50" />
<label for="email">Email: </label>
<input name="email" type="text" size="50" maxlength="50" />
<label for="comments">Comments:</label>
<textarea name="comments" cols="50" rows="15"></textarea>
</fieldset>
<fieldset class="send_btn">
<button class="btn" name="send"/>
</fieldset>
</form>
</div>
<div id="letter">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="600" height="50" id="letter_fly" align="center">
<param name="movie" value="letter_fly.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#333333" />
<param name="play" value="true" />
<param name="loop" value="false" />
<param name="wmode" value="transparent" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="letter_fly.swf" width="600" height="50" align="center">
<param name="movie" value="letter_fly.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#333333" />
<param name="play" value="true" />
<param name="loop" value="false" />
<param name="wmode" value="transparent" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--<![endif]-->
<a href="http://www.adobe.com/go/getflash">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
<div id="footer">
<img src="images/footer.png" width="1024" height="200" class="footer" />
</div>
</div>
<!-- End Save for Web Slices -->
</body>
</html>
and the css
@charset "utf-8";
html
{
}
body
{
margin:0;
padding:0;
height:100%;
}
* html body
{
height: 100%;
}
#wrapper
{
position:relative;
background-color:#f5f5f5;
margin-left:-512px;
left:50%;
width:1024px;
border:none;
padding:0;
min-height: 100%;
height: auto !important;
height: 100%;
margin-bottom:-200px;
}
#header
{
}
.header_01
{
}
img.logo_btn
{
float: left;
border:none;
z-index:10;
}
li
{
height: 78px;
padding: 0 !important;
margin: 0 !important;
overflow: hidden;
}
#m_list li
{
display:block;
float:left;
}
* html #m_list li
{
display:inline; /* for IE 6 */
}
* + html #m_list li
{
display:inline; /* for IE 7 */
}
.header_02
{
}
#form
{
padding:10px;
padding-bottom:200px;
}
.comments_box
{
}
div #comments_box
{
height:555px;
width:514px;
background-image:url(images/contact.png);
background-repeat:no-repeat;
}
#comments_box
{
margin:2em auto 0 auto;
padding:4em 0 2em 0;
}
form
{
width:514px;
height:17px;
margin-top: -40px;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
}
label
{
z-index:10;
display:block;
}
fieldset
{
border:none;
}
.send_btn
{
border:none;
width:166px;
height:49px;
}
.btn
{
margin-top:20px;
border:none;
width:166px;
height:49px;
background-image:url(images/contact_btn.jpg);
background-repeat:no-repeat;
background-color:transparent;
}
.btn:hover
{
border:none;
width:166px;
height:49px;
background-image:url(images/contact_btn_roll.jpg);
background-repeat:no-repeat;
background-color:transparent;
}
#letter
{
height:50px;
width:600px;
}
#letter_fly
{
position:absolute;
margin-top:-626px;
margin-left:-200px;
}
#footer
{
position:absolute;
bottom:0;
width:100%;
bottom:0px;
height:200px;
left:50%;
margin-left:-512px;
width:1024px;
}
the #letter_fly id is the id im useing to position my flash again its perfect on firefox but IE pos is all out of wack thx for any help