Swf file in a div tag problem

Home ›

ASP.NET Forums » Microsoft Downloads » CSS Friendly Control Adapters » Swf file in a div tag problem

Shortcuts

Previous Next

Swf file in a div tag problem

Rate It (1)

Last post 06-15-2009 5:46 PM by blandi1980. 11 replies.

Sort Posts:

Swf file in a div tag problem

08-20-2008, 1:11 PM

Contact

30 point Member
kirilminev
Member since 06-12-2007, 12:20 PM
Posts 212

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>

Re: Swf file in a div tag problem

08-20-2008, 2:00 PM

Contact

198 point Member
igor.p
Member since 11-14-2007, 7:08 PM
Montgomery, AL
Posts 29

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.

Igor
my blog

[If this post answers your question, I would appreciate your marking it as "Answer"]
-- Deus est ergo cogito.

Re: Swf file in a div tag problem

08-20-2008, 2:26 PM

Contact

30 point Member
kirilminev
Member since 06-12-2007, 12:20 PM
Posts 212

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

08-20-2008, 2:28 PM

Contact

30 point Member
kirilminev
Member since 06-12-2007, 12:20 PM
Posts 212

I switched it from % to pixels and it worked.

Thank you.

Re: Swf file in a div tag problem

08-20-2008, 2:37 PM

Contact

30 point Member
kirilminev
Member since 06-12-2007, 12:20 PM
Posts 212

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

08-20-2008, 4:01 PM

Contact

30 point Member
kirilminev
Member since 06-12-2007, 12:20 PM
Posts 212

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

08-20-2008, 9:08 PM

Contact

198 point Member
igor.p
Member since 11-14-2007, 7:08 PM
Montgomery, AL
Posts 29

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

Igor
my blog

[If this post answers your question, I would appreciate your marking it as "Answer"]
-- Deus est ergo cogito.

Re: Swf file in a div tag problem

08-21-2008, 10:19 AM

Contact

30 point Member
kirilminev
Member since 06-12-2007, 12:20 PM
Posts 212

<!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

08-21-2008, 11:28 AM

Contact

Answer

198 point Member
igor.p
Member since 11-14-2007, 7:08 PM
Montgomery, AL
Posts 29

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;

}

Igor
my blog

[If this post answers your question, I would appreciate your marking it as "Answer"]
-- Deus est ergo cogito.

Re: Swf file in a div tag problem

08-21-2008, 11:32 AM

Contact

198 point Member
igor.p
Member since 11-14-2007, 7:08 PM
Montgomery, AL
Posts 29

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