Its height - not width! For some flaw of nature I cannot edit the title.

 

When I resize window and when vertical scrollbar appears, if I scroll it way to the bottom, - the bottom breaks. I dont understand why, but I think it has something to do with the way how page uses 100% height Any help would be appreciated!

 

Here's website <

 

Here's screen:

 

Here's html:

<!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" xml:lang="en" lang="en">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<link rel="stylesheet" type="text/css" href="css.css" />

</head><body>

<div id="horizon">
<div id="wrapper">

<div id="bg"></div>

<div id="flashcontent">
	<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="579" height="460">
		<param name="movie" value="main1.swf" />

		   <param name="quality" value="high" />
		   <param name="MENU" value="false" />
		   <param name="wmode" value="transparent" />
<!--IE-->
	<object data="main1.swf" width="579" height="350" type="application/x-shockwave-flash">
		  <param name="quality" value="high" />
		  <param name="pluginurl" value="http://www.macromedia.com/go/getflashplayer" />
		  <param name="MENU" value="false" />
		  <param name="wmode" value="transparent" />

	</object>
<!--IE-->
  </object></div>

</div>
</div>

</body></html>

 

Here's css:

@charset "utf-8";

body {
margin:0;
padding:0;
height: 100%;
background: url(images2/bg.gif) repeat;
}

object { 
outline:none; /* ff bug */
} 

/* WRAPPER */

#horizon {
position: absolute;
left: 0px;
width: 100%;
height: 100%;
text-align: center;
min-width: 589px;
}
#wrapper {
position: relative;
text-align: left;
width: 589px;
height: 100%;
margin: 0px auto;
}

/* GENERAL */

#flashcontent {
position: absolute;
top: 179px;
left: 5px;
width: 579px;
height: 350px;
z-index: 1;
}

#bg {
position: absolute;
top: 0px;
left: 4px;
width: 581px;
height: 100%;
background-color: white;
z-index: 0;
}

<div id="bg"></div>

 

for what ?

 

add

background-color: white;

to #wrapper and see what will be.

 

or send html+css file (im to lazy to ctrl+c ctrl+v) :]

<div id="bg"></div>

 

for what ?

 

add

background-color: white;

to #wrapper and see what will be.

 

or send html+css file (im to lazy to ctrl+c ctrl+v) :]

 

Here

Try changing the height: 100%; to height: auto;