tags:

views:

33

answers:

0

I'm trying to make a fluid design, I'm using percentage for width and height trough out the site,

but I have an embedded flash file which doesn't follow the percentage, I have to use em which is not good and it doesn't resize according to the viewport. so I was wondering if I'm doing sth wrong.

this is the link to the website when 100% height is set to flash link text

<div id="main_wrapper">
  <div id="main_content">

    <div id="column2">
            <object id="flash">
               <param name="movie" value="how_it_works2.swf">
                  <embed src="flash/how_it_works2.swf" ></embed>
        </object>
    </div>
  </div>
</div>



#main_wrapper {
    width:100%;
    text-align:left;
    position:relative;
    height:auto !important; /* real browsers */
    height:100%; /* IE6: treaded as min-height*/

    min-height:100%; /* real browsers */

}

#main_content {
    width:100%;
    height:47%;
    position:relative;
    margin-top:-45%;
    clear:both;
}

#column2 {
    width:35%;
    height:100%;
    float:left;
}

object#flash {
    width:100%;
    height:100%;
}

object#flash embed {
    width:100%;
    height:40em; //when this is set to 100% it shows about 20em height
}