| Flash Object not respecting div height in Gecko
|
DCElliott
msg:1197726 | 5:13 pm on Feb 17, 2003 (gmt 0) |
This is a crossover question, part CSS and part Flash. By way of preamble. I am trying to develop highly liquid CSS based sites that use relative sizing of page elements (header, footer, nav and content) One of the problems I have come across is how to create a elastic banner that will actually resize when the user resizes the window. If you use a blocky font, it is amazing what you can do with a transparent monochrome gif and make it dimensioned in %ages rather than px. However, to get a truly resizable header, you need a vector object, the most common example being Flash. (Please - I don't want to discuss the merits of using Flash here - that's another thread ;)) My problem: I have a Flash header with a nominal size of about 80px x 800px. This header is in a CSS div with this CSS: #masthead {
position : absolute; overflow: hidden;
top: 0;left: 23%;
height: 9%;
width: 73%;
text-align : center;
margin: 0;
border: 1px dotted yellow;
} |
|
and this HTML <div id="masthead">
<object type="application/x-shockwave-flash" data="header.swf" style="height:99%; width:99%;" />
<param name="movie" value="header.swf" />
<img src="tools.gif" width="99%" height="99%"
alt="" />
</object>
</div> |
|
This works beautifully in IE5+ & 6, but fails in Gecko. Specifically, the Flash object fills 99% of the viewport height, not 99% of the div. I'm not sure if this is a coding problem on my part :( or a Flash problem, or a Browser problem in Gecko? Has anyone else tried this or had similar experience with relatively-sized Flash objects? I have posted this question on another Forum without luck. This seems to be the most knowledgeable group on the net so I am sure someone has an idea. Thanks, DE
|
WibbleWobble
msg:1197727 | 5:18 pm on Feb 17, 2003 (gmt 0) |
It was suggested very recently (I forget by who) that a height attribute ought to be applied to the body element, too. I'm not sure of its relevence entirely, having never looked into it, but it sounds as plausible as anything I can think of. I'm sure someone'll solve it, through some cunning methodolgy unbeknownst to non-wizardy people. Found the link, and it was SuzyUK who mentioned it here [webmasterworld.com]
|
DCElliott
msg:1197728 | 6:29 pm on Feb 17, 2003 (gmt 0) |
The body DOES have a height property: html {
height:100%;
margin:0;
padding:0;
}
body {
height:98%;
margin: 0;
padding: 0;
background-color : #D6D3CE;
background-image : url(Watermark.gif);
background-repeat : no-repeat;
background-position : 50%;
background-attachment : fixed;
min-height: 300px;
min-width: 500;
overflow: hidden;
} |
|
but you are right in making the point. Thanks DE
|
|
|
