homepage Welcome to WebmasterWorld Guest from 54.166.108.167
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

    
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

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved