Jump to content


Centering Flash on the page


8 replies to this topic

#1 cng

    Young Padawan

  • Members
  • Pip
  • 55 posts

Posted 02 August 2006 - 11:05 AM

This may be very simple but I couldnt figure it out on my own and I dont know the correct terms so I cant google. Do I say, alignment or floating (or is floating something totally different)? Anyways, I want my Flash dead center of the page no matter how the user open the page (or how big the window is). I've also made a table with the Flash in the table so basically, I want to center the whole table. Table width 800 pixels and height 100%.

Edited by cng, 02 August 2006 - 11:05 AM.


#2 Erik Bernskiold

    Jedi In Training

  • Members
  • PipPip
  • 422 posts
  • Gender:Male
  • Location:Gothenburg, Sweden
  • Interests:I love to do booth Web Design and Photography. Nothing beats a nice day out in the nature with the camera gear, getting loads of nice photos. I have been playing the flute for 6 years now and I love it, and I am playing the pipe organ as well. I also like to teach other people the in and outs of software such as the CS3 suite from Adobe.

Posted 02 August 2006 - 11:51 AM

I suppose that would work the same way as with general XHTML code?

I think thse use of the <center>FLASH EMBED</center> would use? Otherwise read the below.

I would advise you to jump off the table idea for it and use CSS for it. I'd recommend this code as I find it to work always. Please the flash embed in between the <div> and </div>.

<div style="margin: 0px auto 0px auto 0px;">FLASH EMBED</div>

If you still want to use the tables, just add
align="center
to the <table> tag.

Edited by Erik B, 02 August 2006 - 11:52 AM.


#3 seraph!m

    Pixels 4 Life!

  • Members
  • Pip
  • 172 posts
  • Location:&quot;In heavenly places...&quot;

Posted 02 August 2006 - 11:56 AM

:firefox:-->
QUOTE(Erik B @ Aug 2 2006, 12:51 PM) <{POST_SNAPBACK}>


[/quote]

Won't the margin auto trick only work if the body is set to text-align: center?

:P

#4 Matthew.

    Official Spammer .Matt

  • Members
  • PipPipPipPip
  • 2,749 posts
  • Gender:Male
  • Location:England

Posted 02 August 2006 - 12:04 PM

umm...why margin??!! that centers fromthe side of the browsers if that makes sense, not the content within. (it only works with a width.)

Either:
<div style="text-align: center;">FLASH EMBED</div>

or

<div align="center">FLASH EMBED</div>

You can also do it with padding.

Also just to correct you slightly Erik B, if you were going to use margin, you would use it like:

margin: 0 auto;

no need for the rest.

Edited by .Matt, 02 August 2006 - 12:04 PM.


#5 cng

    Young Padawan

  • Members
  • Pip
  • 55 posts

Posted 02 August 2006 - 12:10 PM

View Post.Matt, on Aug 2 2006, 05:03 PM, said:

umm...why margin??!! that centers fromthe side of the browsers if that makes sense, not the content within. (it only works with a width.)

Either:
<div style="text-align: center;">FLASH EMBED</div>

or

<div align="center">FLASH EMBED</div>

You can also do it with padding.

Also just to correct you slightly Erik B, if you were going to use margin, you would use it like:

margin: 0 auto;

no need for the rest.

This is what I have so far:

<table width="800" height="100%" border="0" align="center" cellpadding="0" cellspacing="0">
  
  <tr>
	<td>&nbsp;</td>
  </tr>
  <tr>
	<td height="218" valign="middle"><div align="right"><span class="style1">cng
	  <div align="center"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="800" height="200" align="absmiddle">
		<param name="movie" value="elevator.swf" />
		<param name="quality" value="high" />
		<embed src="elevator.swf" width="800" height="200" align="absmiddle" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"></embed>
		  </object></div>
	</span></div></td>
  </tr>
  <tr>
	<td valign="middle">&nbsp;</td>
  </tr>
</table>

And it is still not at the middle of my page.

#6 seraph!m

    Pixels 4 Life!

  • Members
  • Pip
  • 172 posts
  • Location:&quot;In heavenly places...&quot;

Posted 02 August 2006 - 01:31 PM

Well if everything else is in tables on that website, why not just center the table and not worry about a DIV?

:P

#7 cng

    Young Padawan

  • Members
  • Pip
  • 55 posts

Posted 02 August 2006 - 01:34 PM

It is centered width-wise but I dont know how to center it height-wise. I want it to always be in the middle no matter what resolution you view it in. If I indent and skip spaces, it would be middle for people with higher resolution but bottom for those with lower resolution.

#8 funkysoul

    The Funky Stuff

  • Publishing Betazoids
  • PipPipPipPip
  • 2,307 posts
  • Gender:Male
  • Location:Zurich, Switzerland
  • Interests:Music: HIM, HIM, HIM, Cafe del Mar, Linkin Park, Fort Minor, Coldplay, Eric Jordan<br />Sports: Snowboarding, KiteSurfing, Extreme Sports<br />Computer: Flash, After Effects, Actionscript

Posted 02 August 2006 - 02:30 PM

here a snippet of one of my sites:
</head>
<body>
<div id="container">
<div id="content">
<div align="center">

  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="900" height="600" title="website">
	<param name="movie" value="site_ger.swf">
	<param name="quality" value="high">
	<embed src="site_ger.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="900" height="600"></embed>
  </object>
	</div>
</div>
</div>

and the CSS:
html, body{
height:100%;
}

body{
margin:0;
padding:0;
text-align:center;
min-height:600px; 
background:#000000;
}

#container{
position: relative;
margin: 0 auto;
text-align: left;
width:900px; 
height:100%;
}

#content{
position:absolute;
width:900px; //width of the flash movie
height:600px; //height of the flash movie
top:50%;
margin-top:-300px;
background:#000000;
}

Edited by funkysoul, 02 August 2006 - 02:31 PM.


#9 Erik Bernskiold

    Jedi In Training

  • Members
  • PipPip
  • 422 posts
  • Gender:Male
  • Location:Gothenburg, Sweden
  • Interests:I love to do booth Web Design and Photography. Nothing beats a nice day out in the nature with the camera gear, getting loads of nice photos. I have been playing the flute for 6 years now and I love it, and I am playing the pipe organ as well. I also like to teach other people the in and outs of software such as the CS3 suite from Adobe.

Posted 03 August 2006 - 03:45 AM

Sorry for the little mistake in my code, I was tired when I wrote it. But as said , if you already use tables, the easiest path is to add align="center" into the td tag, or do as .Matt said.

Matt, I belive he wanted the Flash Embed centered and not the content, that's how I took it...





1 user(s) are reading this topic

0 members, 1 guests, 0 anonymous users