...

View Full Version : white bar in IE7 on top of flash box



nkraus
10-13-2008, 05:39 PM
Hey guys,
This is my first time posting a thread... so if you need more information please don't hesitate to ask.

I have an issue when viewing one of my pages in IE7 (and probably all other versions... it is an HTML page with a flash box in it. A white bar appears above the flash box. Only in IE, not in Safari or in Firefox.

This is the page (check in IE then firefox):
http://www.krausgroupmarketing.com/pages/services_marketing.html

[B]This is the code:

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>The Kraus Group Marketing Services</title>
<link href="../css/nick1.css" rel="stylesheet" type="text/css" media="all" />
<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>
<style type="text/css">
<!--
.style3 {
font-size: small
}


-->
</style>
<script src="../Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
</head>

<body onload="MM_preloadImages('../images/r1.gif','../images/r2.gif','../images/r3.gif','../images/r4.gif','../images/r5.gif','../images/fr3.gif','../images/frp1.gif','../images/fr2.gif')">
<div id= "container">

<div id= "mastheadleft"><a href="../index.html"><img src="../images/logo.gif" alt="the kraus group logo" width="202" height="78" border= "0" /></a></div>

<div id= "mastheadright"><img src="../images/services.gif" width="293" height="109" />
</div>

<div id= "topnav"><img src="../images/phlft.gif" alt="placeholder" width="96" height="31" /><a href="../index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image4','','../images/r1.gif',1)"><img src="../images/b1.gif" name="Image4" width="122" height="31" border="0" id="Image4" /></a><a href="services_marketing.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('services','','../images/r2.gif',1)"><img src="../images/r2.gif" name="services" width="121" height="31" border="0" id="services" /></a><a href="portfolio/portfolio_logos.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('portfolio','','../images/r3.gif',1)"><img src="../images/b3.gif" alt="portfolio" name="portfolio" width="120" height="31" border="0" id="portfolio" /></a><a href="quote.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('quote','','../images/r4.gif',1)"><img src="../images/b4.gif" alt="quote" name="quote" width="120" height="31" border="0" id="quote" /></a><a href="contact.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('contact','','../images/r5.gif',1)"><img src="../images/b5.gif" alt="contact" name="contact" width="121" height="31" border="0" id="contact" /></a><img src="../images/phrt.gif" alt="placeholderright" width="100" height="31" /></div>




<div id= "body1">
<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','573','height','424','title','The Kraus Group Marketing','src','../images/flash_files/marketing_temp','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','../images/flash_files/marketing_temp' ); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="573" height="424" title="The Kraus Group Marketing">
<param name="movie" value="../images/flash_files/marketing_temp.swf" />
<param name="quality" value="high" />
<embed src="../images/flash_files/marketing_temp.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="573" height="424"></embed>
</object></noscript>
</noscript></div>

<div id= "servnav"><a href="services_marketing.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('marketing','','../images/frp1.gif',1)"><img src="../images/frp1.gif" alt="marketing services" name="marketing" width="161" height="36" border="0" id="marketing" /></a><a href="web design.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('web design','','../images/fr2.gif',1)"><img src="../images/fb2.gif" alt="web design services" name="web design" width="153" height="36" border="0" id="web design" /></a><a href="services_printing.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('printing','','../images/fr3.gif',1)"><img src="../images/fb3.gif" alt="printing" name="printing" width="153" height="36" border="0" id="printing" /></a><img src="../images/service_placeholder.gif" width="108" height="36" /></div>

</body>
</html>

nkraus
10-13-2008, 05:41 PM
Just in case you need to see the CSS too...


#aboutbox {
height: 510px;
width: 810px;
left: 0px;
top: 139px;
text-align:left;
position: absolute;
background-image: url(../images/contact.gif);
background-repeat: no-repeat;
}

#aboutpara1{
left: 467px;
top: 160px;
width: 283px;
position: absolute;
}

#aboutpara2{
left: 288px;
top: 277px;
width: 253px;
position: absolute;
}


#aboutpara3{
left: 467px;
top: 372px;
width: 256px;
position: absolute;
}

#aboutpara4{
left: 288px;
top: 469px;
width: 245px;
position: absolute;
}

#aboutpara5{
left: 288px;
top: 552px;
width: 380px;
position: absolute;
}

#aboutpic1{
left: 275px;
width: 185px;
top: 153px;
position: absolute;
}

#aboutpic2{
left: 549px;
width: 243px;
top: 250px;
position: absolute;
}

#aboutpic3{
left: 275px;
top: 342px;
width: 185px;
position: absolute;
}

#aboutpic4{
left: 549px;
width: 185px;
top: 435px;
position: absolute;
}

.abouttext{
font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif;
font-size: small;
font-size: 95%;
line-height: 148%;
text-align: left;
margin-left: 0px;
margin-top: 0px;
}

#articlepara{
left: 73px;
top: 150px;
width: 650px;
font-size: 104%;
line-height: 128%;
position: absolute;
}

#articlepara1{
left: 73px;
top: 200px;
width: 157px;
font-size: 104%;
line-height: 128%;
position: absolute;
}

.coltext{
font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif;
font-size: small;
font-size: 95%;
line-height: 140%;
text-align: left;
margin-top: 0px;
margin-bottom: -4px;
margin-left: 10px;
margin-top: 10px;
}

.colpic{
font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif;
font-size: small;
font-size: 95%;
line-height: 140%;
text-align: left;
margin-top: 10px;
margin-left: 3px;
margin-bottom: 4px;
}

body {
font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif;
font-size: small;
text-align:left;
background-image: url(../images/bckrnd2.gif);
background-repeat: repeat-x;
margin-left: 0px;
margin-top: 0px;
}

#body1 {
width: 575px;
height: 421px;
left: 112px;
top: 199px;
text-align: center;
position: absolute;
margin-bottom: 0px;
}


#col2 {
width: 540px;
left: 210px;
top: 140px;
position: absolute;
}

#col3 {
width: 248px;
left: 500px;
top: 100px;
position: absolute;
background-color: #eeeeee;
border-left: 2px solid #333333;
}

#container {
width:830px; margin:0 auto; text-align:center; position:relative;
}

#flashbox {
height: 510px;
width: 760px;
left: 0px;
top: 139px;
text-align:left;
position: absolute;
}

#folderbox {
height: 418px;
width: 802px;
left: 0px;
top: 184px;
text-align:left;
position: absolute;
background-image: url(../images/folder_background_white_pg.gif);
background-repeat: no-repeat;
}

#leftnav {
height: 400px;
width: 160px;
left: 0px;
top: 100px;
position: absolute;
border-right: 1px solid #cccccc;
background-color: #666666;
}

#lftcolumn{
left: 63px;
top: 139px;
width: 197px;
position: absolute;
text-align: left;
background-color: #cbd1da;
}

#lftcolumnpic{
left: 66px;
top: 515px;
width: 245px;
position: absolute;
}


.logoindent{
margin-left: 237px;
margin-top: 47px;
}

.mainparatitle {
width: 386px;
height: 76px;
left: 276px;
top: 75px;
position: absolute;
visibility: visible;
}

.mainpara {
width: 386px;
height: 76px;
left: 276px;
top: 90px;
position: absolute;
visibility: visible;
}

#mainstory {
width: 386px;
left: 276px;
top: 258px;
position: absolute;
z-index: 3;
visibility: visible;
}

#mainstory ul li{
list-style-image: url(../images/bullet.gif);
padding-bottom: 10px;
padding-top: 10px;
padding-right: 30px;
border-bottom: 1px solid #333333;
margin-left: 20px;
margin-right: 6px;
}

#mainstory a:link {
color:#0066CC;
text-decoration: none;
}

#mainstory a:visited {
color:#999999;
text-decoration: none;
}

#mainstory a:hover {
color:#000000;
text-decoration: underline;
font-weight: 700;
}

#mainstory a:active {
color:#cc0000;
text-decoration: underline;
font-weight: 700;
}

#mastheadleft {
height: 100px;
width: 300px;
left: 0px;
top: 15px;
position: absolute;
}

#mastheadright {
height: 108px;
width: 300px;
left: 507px;
top: 0px;
text-align:left;
position: absolute;
}

#paperbox {
height: 517px;
width: 713px;
left: 45px;
top: 139px;
text-align:left;
position: absolute;
background-repeat: no-repeat;
}

#picturebox {
height: 510px;
width: 800px;
left: 0px;
top: 141px;
text-align:left;
position: absolute;
background-image: url(../images/portfolio/portfolio_bg1.jpg);
background-repeat: no-repeat;
}

.subhead1 {
font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif;
font-size: 120%;
font-weight: 700;
padding-left: 10px;
color: #333366;
}

#servnav {
height: 36px;
width: 800px;
left: 114px;
top: 173px;
text-align:left;
position: absolute;
}

#sidenav {
height: 500px;
width: 41px;
left: 567px;
top: 139px;
text-align:left;
position: absolute;
}

#stickie{
width: 195px;
height: 122px;
top: 161px;
left: 595px;
position: absolute;
}

.style1 {
font-size: 22px;
font-weight: bold;
font-style: italic;
color: #333333;
}


.style2 {
color: #0000FF;
font-weight: bold;
}

.title {
font-family: Adobe Garamond Pro, Palatino, serif;
font-size: 227%;
line-height: 90%;
color: #000000;
margin-bottom: -3px;
margin-top: 12px;
margin-left: 10px;
margin-right: 10px;
}

.text1 {
font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif;
font-size: small;
padding-left: 10px;
padding-right: 10px;
color: #333366;
}

#topnav{
width: 800px;
height: 31px;
top: 108px;
left: 0px;
position: absolute;
}

dome90uk
10-14-2008, 11:03 AM
just tested in FF 2.0.0.17 and also get the white bar.

What height is your flash? - 424px (on page) OR 421px ( body1 in CSS )

Have you tried to reduce the size of the flash div to 421px?

nkraus
10-14-2008, 05:11 PM
See sheet now... no luck still... any other ideas?



<body onload="MM_preloadImages('../images/r1.gif','../images/r2.gif','../images/r3.gif','../images/r4.gif','../images/r5.gif','../images/fr3.gif','../images/frp1.gif','../images/fr2.gif')">
<div id= "container">

<div id= "mastheadleft"><a href="../index.html"><img src="../images/logo.gif" alt="the kraus group logo" width="202" height="78" border= "0" /></a></div>

<div id= "mastheadright"><img src="../images/services.gif" width="293" height="109" />
</div>

<div id= "topnav"><img src="../images/phlft.gif" alt="placeholder" width="96" height="31" /><a href="../index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image4','','../images/r1.gif',1)"><img src="../images/b1.gif" name="Image4" width="122" height="31" border="0" id="Image4" /></a><a href="services_marketing.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('services','','../images/r2.gif',1)"><img src="../images/r2.gif" name="services" width="121" height="31" border="0" id="services" /></a><a href="portfolio/portfolio_logos.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('portfolio','','../images/r3.gif',1)"><img src="../images/b3.gif" alt="portfolio" name="portfolio" width="120" height="31" border="0" id="portfolio" /></a><a href="quote.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('quote','','../images/r4.gif',1)"><img src="../images/b4.gif" alt="quote" name="quote" width="120" height="31" border="0" id="quote" /></a><a href="contact.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('contact','','../images/r5.gif',1)"><img src="../images/b5.gif" alt="contact" name="contact" width="121" height="31" border="0" id="contact" /></a><img src="../images/phrt.gif" alt="placeholderright" width="100" height="31" /></div>




<div id= "body1">
<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','573','height','424','title','The Kraus Group Marketing','src','../images/flash_files/marketing_temp','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','../images/flash_files/marketing_temp' ); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="573" height="421" title="The Kraus Group Marketing">
<param name="movie" value="../images/flash_files/marketing_temp.swf" />
<param name="quality" value="high" />
<embed src="../images/flash_files/marketing_temp.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="573" height="421"></embed>
</object></noscript>
</noscript></div>

<div id= "servnav"><a href="services_marketing.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('marketing','','../images/frp1.gif',1)"><img src="../images/frp1.gif" alt="marketing services" name="marketing" width="161" height="36" border="0" id="marketing" /></a><a href="web design.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('web design','','../images/fr2.gif',1)"><img src="../images/fb2.gif" alt="web design services" name="web design" width="153" height="36" border="0" id="web design" /></a><a href="services_printing.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('printing','','../images/fr3.gif',1)"><img src="../images/fb3.gif" alt="printing" name="printing" width="153" height="36" border="0" id="printing" /></a><img src="../images/service_placeholder.gif" width="108" height="36" /></div>

</body>
</html>



CSS:
#
aboutbox {
height: 510px;
width: 810px;
left: 0px;
top: 139px;
text-align:left;
position: absolute;
background-image: url(../images/contact.gif);
background-repeat: no-repeat;
}

#aboutpara1{
left: 467px;
top: 160px;
width: 283px;
position: absolute;
}

#aboutpara2{
left: 288px;
top: 277px;
width: 253px;
position: absolute;
}


#aboutpara3{
left: 467px;
top: 372px;
width: 256px;
position: absolute;
}

#aboutpara4{
left: 288px;
top: 469px;
width: 245px;
position: absolute;
}

#aboutpara5{
left: 288px;
top: 552px;
width: 380px;
position: absolute;
}

#aboutpic1{
left: 275px;
width: 185px;
top: 153px;
position: absolute;
}

#aboutpic2{
left: 549px;
width: 243px;
top: 250px;
position: absolute;
}

#aboutpic3{
left: 275px;
top: 342px;
width: 185px;
position: absolute;
}

#aboutpic4{
left: 549px;
width: 185px;
top: 435px;
position: absolute;
}

.abouttext{
font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif;
font-size: small;
font-size: 95%;
line-height: 148%;
text-align: left;
margin-left: 0px;
margin-top: 0px;
}

#articlepara{
left: 73px;
top: 150px;
width: 650px;
font-size: 104%;
line-height: 128%;
position: absolute;
}

#articlepara1{
left: 73px;
top: 200px;
width: 157px;
font-size: 104%;
line-height: 128%;
position: absolute;
}

.coltext{
font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif;
font-size: small;
font-size: 95%;
line-height: 140%;
text-align: left;
margin-top: 0px;
margin-bottom: -4px;
margin-left: 10px;
margin-top: 10px;
}

.colpic{
font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif;
font-size: small;
font-size: 95%;
line-height: 140%;
text-align: left;
margin-top: 10px;
margin-left: 3px;
margin-bottom: 4px;
}

body {
font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif;
font-size: small;
text-align:left;
background-image: url(../images/bckrnd2.gif);
background-repeat: repeat-x;
margin-left: 0px;
margin-top: 0px;
}

#body1 {
width: 575px;
height: 421px;
left: 112px;
top: 199px;
text-align: center;
position: absolute;
margin-bottom: 0px;
}


#col2 {
width: 540px;
left: 210px;
top: 140px;
position: absolute;
}

#col3 {
width: 248px;
left: 500px;
top: 100px;
position: absolute;
background-color: #eeeeee;
border-left: 2px solid #333333;
}

#container {
width:830px; margin:0 auto; text-align:center; position:relative;
}

#flashbox {
height: 510px;
width: 760px;
left: 0px;
top: 139px;
text-align:left;
position: absolute;
}

#folderbox {
height: 418px;
width: 802px;
left: 0px;
top: 184px;
text-align:left;
position: absolute;
background-image: url(../images/folder_background_white_pg.gif);
background-repeat: no-repeat;
}

#leftnav {
height: 400px;
width: 160px;
left: 0px;
top: 100px;
position: absolute;
border-right: 1px solid #cccccc;
background-color: #666666;
}

#lftcolumn{
left: 63px;
top: 139px;
width: 197px;
position: absolute;
text-align: left;
background-color: #cbd1da;
}

#lftcolumnpic{
left: 66px;
top: 515px;
width: 245px;
position: absolute;
}


.logoindent{
margin-left: 237px;
margin-top: 47px;
}

.mainparatitle {
width: 386px;
height: 76px;
left: 276px;
top: 75px;
position: absolute;
visibility: visible;
}

.mainpara {
width: 386px;
height: 76px;
left: 276px;
top: 90px;
position: absolute;
visibility: visible;
}

#mainstory {
width: 386px;
left: 276px;
top: 258px;
position: absolute;
z-index: 3;
visibility: visible;
}

#mainstory ul li{
list-style-image: url(../images/bullet.gif);
padding-bottom: 10px;
padding-top: 10px;
padding-right: 30px;
border-bottom: 1px solid #333333;
margin-left: 20px;
margin-right: 6px;
}

#mainstory a:link {
color:#0066CC;
text-decoration: none;
}

#mainstory a:visited {
color:#999999;
text-decoration: none;
}

#mainstory a:hover {
color:#000000;
text-decoration: underline;
font-weight: 700;
}

#mainstory a:active {
color:#cc0000;
text-decoration: underline;
font-weight: 700;
}

#mastheadleft {
height: 100px;
width: 300px;
left: 0px;
top: 15px;
position: absolute;
}

#mastheadright {
height: 108px;
width: 300px;
left: 507px;
top: 0px;
text-align:left;
position: absolute;
}

#paperbox {
height: 517px;
width: 713px;
left: 45px;
top: 139px;
text-align:left;
position: absolute;
background-repeat: no-repeat;
}

#picturebox {
height: 510px;
width: 800px;
left: 0px;
top: 141px;
text-align:left;
position: absolute;
background-image: url(../images/portfolio/portfolio_bg1.jpg);
background-repeat: no-repeat;
}

.subhead1 {
font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif;
font-size: 120%;
font-weight: 700;
padding-left: 10px;
color: #333366;
}

#servnav {
height: 36px;
width: 800px;
left: 114px;
top: 173px;
text-align:left;
position: absolute;
}

#sidenav {
height: 500px;
width: 41px;
left: 567px;
top: 139px;
text-align:left;
position: absolute;
}

#stickie{
width: 195px;
height: 122px;
top: 161px;
left: 595px;
position: absolute;
}

.style1 {
font-size: 22px;
font-weight: bold;
font-style: italic;
color: #333333;
}


.style2 {
color: #0000FF;
font-weight: bold;
}

.title {
font-family: Adobe Garamond Pro, Palatino, serif;
font-size: 227%;
line-height: 90%;
color: #000000;
margin-bottom: -3px;
margin-top: 12px;
margin-left: 10px;
margin-right: 10px;
}

.text1 {
font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif;
font-size: small;
padding-left: 10px;
padding-right: 10px;
color: #333366;
}

#topnav{
width: 800px;
height: 31px;
top: 108px;
left: 0px;
position: absolute;
}



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum