Whyyyyyyyyyyyyyy... (never seen this before)

I have created a very small page that holds one small flash movie. The page looks fine in IE6 but for some strange reason, FF seems to put a horizontal & vertical scroll around the flash movie...

The flash movie is 802px x 396px and i have put the movie in a div that is 396px in height (the same height as the flash movie).

#flash 
	{ 
	height:396px;
	}

Code (markup):

If i make the #flash div 397px in height, both browsers display the movie fine or if i don't declare a height for the #flash div, both browsers also display the movie fine... so i have two fixes, but:

1. WHY won't FF display the movie in the div if i use 396px for the height?

2. Is it ok if i do not declare any height for the #flash div?


Thanks in advance

 

Always declare sizes in width, not height. Ie. instead of height: 396px; make it something along the lines of width: 700px;, that should work.

 

Ok so, does that mean that i do not have to declare a height then

 

Yep, that's right. Declaring the width automatically, in relation to the width, sets the height.

 

I've always set height and width, but I think Spidey's right, since both dimensions should be in the Flash itself (just as a browser can (eventually) figure out the height and width of an image even if you don't tell it because the image has a certain height and width in px anyway-- though some older browsers render the page wrongly without the info). So, possibly you could even get away with no dimensions set, but I wouldn't for the older browsers-- making them figure it out on their own is extra work. Setting one dimension would reduce their work.

I made a scrolling image setup, and found that I needed to set my height for the container quite a bit larger than the images to keep the scrollbar off. FF will set a scrollbar if it thinks all the content won't fit within what you've set.

 

Thanks guys... i set the #flash div as a block which allowed me to use the original height (396px), thanks again