CSS Friendly Control Adapters

Re: Swf file in a div tag problem

blandi1980 — Mon, 15 Jun 2009 21:46:33 GMT

Hi Igor,

This thread has been very helpful, thanks!

One question, the way that it is setup right now, the code seems to be shrinking my flash movie. Is there any way to prevent this from happening?

Thanks!

Brian

Re: Swf file in a div tag problem

kirilminev — Thu, 21 Aug 2008 16:47:49 GMT

Great that solved the problem. Thank Igor

Re: Swf file in a div tag problem

igor.p — Thu, 21 Aug 2008 15:32:42 GMT

<div style="text-align:center"> and its closing tag are not appearing in bold, so I hope you notice them ... I'm not about to weed through all of that markup to figure out what happened .

Re: Swf file in a div tag problem

igor.p — Thu, 21 Aug 2008 15:28:01 GMT

Here are several things that I changed (in bold). The idea is that if you want everything centered, have one element (a div typically) to center everything or have multiple identical divs to center multiple sections. Second, define the size for your objects, not the containers. In your case, it seems like you want your Flash object to be so many pixels wide and so many pixels high. Do it on the object itself. Anyway, after I made these changes, everything was centered in Firefox. Hope this helps!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>
	7Ticks Web Portal
</title><link href="App_Themes/PortalDefault/TopLevelElements.css" rel="stylesheet" type="text/css" /><link href="App_Themes/PortalDefault/FormContainers.css" rel="stylesheet" type="text/css" />
    
    <style type="text/css">
        #form1
        {
            text-align: center;
        }
    </style>
<link href="/WebResource.axd?d=Qw0P1DS5A68rfS_KqH3jt2qaAhUx79KTQrlSmbXBa0J8KqBZ9XGSoTtQMf6IQNUedYk6nF49oAppV_xvBK_4oA2&t=632789952600000000" rel="stylesheet" type="text/css" /></head>
<body>
    <form name="aspnetForm" method="post" action="Default.aspx" id="aspnetForm">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTk3NDQ4NTIyMGRkT0oJJohsUAkO/Z78U+OcLT688t8=" />
</div>
<div style="text-align:center">
    <div id="TopBanner" style="text-align: center">
        <img src="MasterPages/Images/TopBannerBlue.jpg" width="70%" />
       
         <div id="navigation" style="text-align:center"  >
            
                
                
                
                
            
        </div>
    </div>
    
    <br />
    <br />
    <div style="text-align:center">

    

 <div  class="swfContainer">

    <object id="FlashControl5" width="1050" height="650" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0">
<param name="movie" value="Flex_Chart/Nfs_1_0_TopBar.swf">
<param name="quality" value="High">
<param name="play" value="True">
<param name="loop" value="False">
<param name="menu" value="False">
<param name="scale" value="Showall">
<embed name="FlashControl5" src="Flex_Chart/Nfs_1_0_TopBar.swf" quality="High" play="True" menu="False" scale="Showall" loop="False" type="application/x-shockwave-flash" width="100%" height="100%" pluginspage="http://www.macromedia.com/go/getflashplayer">
</embed></object>

    </div>
    

    </div>
</div>
    </form>
</body>
</html>

Also your CSS:

.swfContainer

{

float:none;

clear:both;

text-align: center;

}

Re: Swf file in a div tag problem

kirilminev — Thu, 21 Aug 2008 14:19:12 GMT

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>
	7Ticks Web Portal
</title><link href="App_Themes/PortalDefault/TopLevelElements.css" rel="stylesheet" type="text/css" /><link href="App_Themes/PortalDefault/FormContainers.css" rel="stylesheet" type="text/css" />
    
    <style type="text/css">
        #form1
        {
            text-align: center;
        }
    </style>
<link href="/WebResource.axd?d=Qw0P1DS5A68rfS_KqH3jt2qaAhUx79KTQrlSmbXBa0J8KqBZ9XGSoTtQMf6IQNUedYk6nF49oAppV_xvBK_4oA2&t=632789952600000000" rel="stylesheet" type="text/css" /></head>
<body>
    <form name="aspnetForm" method="post" action="Default.aspx" id="aspnetForm">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTk3NDQ4NTIyMGRkT0oJJohsUAkO/Z78U+OcLT688t8=" />
</div>

    <div id="TopBanner" style="text-align: center">
        <img src="MasterPages/Images/TopBannerBlue.jpg" width="70%" />
       
         <div id="navigation" style="text-align:center"  >
            
                
                
                
                
            
        </div>
    </div>
    
    <br />
    <br />
    <div style="text-align:center">

    

 <div  class="swfContainer">

    <object id="FlashControl5" width="100%" height="100%" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0">
<param name="movie" value="Flex_Chart/Nfs_1_0_TopBar.swf">
<param name="quality" value="High">
<param name="play" value="True">
<param name="loop" value="False">
<param name="menu" value="False">
<param name="scale" value="Showall">
<embed name="FlashControl5" src="Flex_Chart/Nfs_1_0_TopBar.swf" quality="High" play="True" menu="False" scale="Showall" loop="False" type="application/x-shockwave-flash" width="100%" height="100%" pluginspage="http://www.macromedia.com/go/getflashplayer">
</embed></object>

    </div>
    

    </div>

    </form>
</body>
</html>

Thank you.

Re: Swf file in a div tag problem

igor.p — Thu, 21 Aug 2008 01:08:18 GMT

Could you also paste the HTML that the page renders? That would be helpful. Thanks.

Re: Swf file in a div tag problem

kirilminev — Wed, 20 Aug 2008 20:01:17 GMT

Here is my css:

This is class that I am assigning to div tag. The tag renders all the way to the left on firefox and on the center on IE.

How can I render it to display on the center in firefox as well. I played with the float property as well as clear, but no success so far.

.swfContainer
{
	float:none;
	clear:both;
	position:relative;
    text-align: center;
    width: 1050px;
    height: 650px;
    clear:both;
    	
}

Re: Swf file in a div tag problem

kirilminev — Wed, 20 Aug 2008 18:37:02 GMT

One more I came across with. When I sized my swf file to 70 % it doesn't align on the center of the page relevant to my top Content tag.

<asp:Content ID="Content1" ContentPlaceHolderID="LoginContent" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContainer" Runat="Server">

      <br /><br />
    <div  class="swfContainer" width="70% it is set from css">
Test web service
<Bewise:FlashControl BrowserDetection="false"  
                             ID="FlashControl5" 
                             runat="server" 
                             Height="100%" 
  
                             Width="100%" MovieUrl="~/Flex_Chart/Nfs_1_0_TopBar.swf" />
Test web service           
      
    </div>
    
</asp:Content>

If it is not 100% my top banner coming from master page center on the center of the page, but my div and swf are aligned to the left how can I work around that and make sure my swf and div are centered as well.

Thank you.

Re: Swf file in a div tag problem

kirilminev — Wed, 20 Aug 2008 18:28:40 GMT

I switched it from % to pixels and it worked.

Thank you.

Re: Swf file in a div tag problem

kirilminev — Wed, 20 Aug 2008 18:26:11 GMT

I changed the width and height of the div tag to 100% and no difference. On firefox it renders ok on the width, but the height shows very narrow.

Re: Swf file in a div tag problem

igor.p — Wed, 20 Aug 2008 18:00:02 GMT

What immediately stands out is that the div is not sized (i.e. <div style="width:100%...). The flash object's 100% width is relative to the width of its container (that is, the div element). I would try changing the width of the div element to see if it makes a difference.

Hope that helps.

Swf file in a div tag problem

kirilminev — Wed, 20 Aug 2008 17:11:48 GMT

I have swf file on my .aspx web page. The problem I am experiencing is that when I render the same div tag with my swf file on firefox it display as a narrow stripe as oppose to stretching the swf file along the entire page. This does not occur on IE only on firefox.

Any ideas.

Thank you.

      <br /><br />
    <div style="text-align:center">
Test web service
<Bewise:FlashControl BrowserDetection="false"  
                             ID="FlashControl5" 
                             runat="server" 
                             Height="100%" 
  
                             Width="100%" MovieUrl="~/flash.swf" />
Test web service           
      
    </div>
    
</asp:Content>