centering my movie in the browser

  • kelly79
  • Born
  • Born
  • kelly79
  • Posts: 1

Post 3+ Months Ago

Hello!
I've been using Flash (MX) for 3 days now:)
I've created a movie (550x400 pixels) but I don't know how to make it appear in the middle of the browser. It is centered upper left.
I hope that in a month or two I'll stop asking stupid questions like this, but... until then I'll keep buzzing you:)
Thanx... in advance:)
  • ATNO/TW
  • Super Moderator
  • Super Moderator
  • User avatar
  • Posts: 23454
  • Loc: Woodbridge VA

Post 3+ Months Ago

Add this before the beginning object tag of the code for the movie:

Code: [ Select ]
<div align="center" valign="middle">


Then close the tag after the code for the movie:
Code: [ Select ]
</div>
  • lostinbeta
  • Guru
  • Guru
  • User avatar
  • Posts: 1402
  • Loc: Philadelphia, PA

Post 3+ Months Ago

I typically put it within a table.

Code: [ Select ]
<TABLE WIDTH="100%" HEIGHT="100%">
<TR><TD WIDTH="100%" HEIGHT="100%" ALIGN="center" VALIGN="middle">

//.swf embed code here

</TD></TR>
</TABLE>
  1. <TABLE WIDTH="100%" HEIGHT="100%">
  2. <TR><TD WIDTH="100%" HEIGHT="100%" ALIGN="center" VALIGN="middle">
  3. //.swf embed code here
  4. </TD></TR>
  5. </TABLE>
  • ATNO/TW
  • Super Moderator
  • Super Moderator
  • User avatar
  • Posts: 23454
  • Loc: Woodbridge VA

Post 3+ Months Ago

I mean really thank you! I was about to add an addendum to my post because all my method did was center it, but not place it in the middle of the screen. I can't recall that I ever thought about using the height attribute with the table element. I tried doing absolute and relative positioning with it and I could get the thing to center in all resolutions, but never align in the middle (it varied by resolution).

Your solution is so simple -- yet it does the trick. I just fixed one that's been driving me nuts and it works perfect in all resolutions in all browsers.

The Example:
http://glassmango.com/home.html

Thank you, thank you, thank you -- you just provided a solution that will let me do about a half dozen other things I wanted to do but couldn't get to work. I owe you for that simple tip! BIG TIME! {*kicks one's self for not figuring that out!}
  • lostinbeta
  • Guru
  • Guru
  • User avatar
  • Posts: 1402
  • Loc: Philadelphia, PA

Post 3+ Months Ago

lol, woah... uhh ok... it was my pleasure :D

I was wondering about that valign in the div tag that you had. I didn't have time to test it out but as far as I know valign isn't a div property. And I believe you can only set a divs width and height via CSS such as...

Code: [ Select ]
<DIV STYLE="width:100%; height:100%">asdf</DIV>


And there is no CSS for a div that will vertically align (I think). I know there is the vertical-align in CSS, but I believe that is just for spans of text, not for content positioning.

I've been using the table method since I first needed to do this. It was the only method I could think of at the time, and it proves to work perfectly everytime... so if it isn't broke, don't fix it right :wink: Best of all with this is that if you resize your browser the table will auto-resize with it and recenter the content.

Gotta love dynamic sizing :wink: That static sizing just doesn't do the trick for everything :lol:
  • ATNO/TW
  • Super Moderator
  • Super Moderator
  • User avatar
  • Posts: 23454
  • Loc: Woodbridge VA

Post 3+ Months Ago

Quote:
And there is no CSS for a div that will vertically align (I think). I know there is the vertical-align in CSS, but I believe that is just for spans of text, not for content positioning.


Yes -- that is what I discovered...and style positioning wasn't working for what I wanted to do. Your post helped more than you know.

Again -- thanks.
  • lostinbeta
  • Guru
  • Guru
  • User avatar
  • Posts: 1402
  • Loc: Philadelphia, PA

Post 3+ Months Ago

Hehe, I hope this helped kelly79 as much as it helped you :D
  • ATNO/TW
  • Super Moderator
  • Super Moderator
  • User avatar
  • Posts: 23454
  • Loc: Woodbridge VA

Post 3+ Months Ago

For lostinbeta -- here's an example of one of the results of your tip:

http://glassmango.com/

It's one of many little projects that your little piece of advice helped with. I'm in the process of redoing the rest of the site based off that theme -- but that was one page that was driving me nuts that your adviced helped on.

It works in every resolution on every browser I tested!
  • ATNO/TW
  • Super Moderator
  • Super Moderator
  • User avatar
  • Posts: 23454
  • Loc: Woodbridge VA

Post 3+ Months Ago

Man that did everything that I wanted in IE 6 -- same thing in NS 4.78 -- same thing in Opera 5 -- but when it came down to NS 7.1 and Mozilla Firebird it didn't read the height attribute~!


I HATE CROSSBROWSER CAMPATABILITY!!!!

Could someone just make a standard we can all code for!


(Thank God! -- I stated that all without swearing!)
  • lostinbeta
  • Guru
  • Guru
  • User avatar
  • Posts: 1402
  • Loc: Philadelphia, PA

Post 3+ Months Ago

Uhhh, works fine in every browser I tried. Including the latest Netscape, Mozilla and Firebird versions.

Netscape is an AOL loaded version of Mozilla

Mozilla is Netscape that is just toned down to a few things

Firebird is Mozilla that is toned down to fewer things.

They all run off the same engine so they should all work.

I just tested the above site in the latest Mozilla Firebird and it worked perfectly fine.
  • ATNO/TW
  • Super Moderator
  • Super Moderator
  • User avatar
  • Posts: 23454
  • Loc: Woodbridge VA

Post 3+ Months Ago

*sighs...even the Flash on entrance?...I can't get Firebird to load the plugin.

*hmmm...thinking...I only use the aforementioned that didn't work to test stuff. I'll go back and recheck and clear cache etc...(sometime tomorrow...I'm almost too tired tonight to care.)....at least your post is encouraging.
  • lostinbeta
  • Guru
  • Guru
  • User avatar
  • Posts: 1402
  • Loc: Philadelphia, PA

Post 3+ Months Ago

Did you install the plugin for Firebird? It is quite pain to, you have to download the .exe file, then choose other for the browser and browse to the plugins folder in the firebird program folder. Took me like 20 minutes to figure that out :lol:
  • ATNO/TW
  • Super Moderator
  • Super Moderator
  • User avatar
  • Posts: 23454
  • Loc: Woodbridge VA

Post 3+ Months Ago

Hmmm...maybe that's what I missed --- that's a tough one for sure -- I'm almost positive both times I tried, the flash download started and ended and I don't think I remember seeing an option to install it in Firebird as a plugin -- I just assumed it would have been done automatically.

I can't believe Mozilla would have screwed that one up so bad, but apparently they did.
  • the_real_tisse
  • Graduate
  • Graduate
  • the_real_tisse
  • Posts: 116
  • Loc: Belgium

Post 3+ Months Ago

Hi guys

To center it, I use:

Quote:
<div align="center">
<center>
<table border="0" cellpadding="0" cellspacing="0" width="100%" height="100%">
<tr>
<td width="100%" valign="middle" align="center" height="100%">
<object .........
</object>
</td>
</tr>
</table>
</center>
</div>


Just wanted to ask, am I going overboard with all that code?

kind regards
Tisse
  • ATNO/TW
  • Super Moderator
  • Super Moderator
  • User avatar
  • Posts: 23454
  • Loc: Woodbridge VA

Post 3+ Months Ago

Your's is essentially the same thing lostinbeta provided earlier. The div tags you are using are basically duplicating what your td element is doing. In this instance they aren't necessary.
  • UNFLUX
  • Genius
  • Genius
  • User avatar
  • Posts: 6375
  • Loc: twitter.com/unflux

Post 3+ Months Ago

ditto :)

Post Information

  • Total Posts in this topic: 16 posts
  • Users browsing this forum: No registered users and 10 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.