Archinect
anchor

flash/html help

auvn

Hi,
I am revising website for our office. Now I would like to cener our website in the center of screen like http://www.field-office.com/
Could anyone please provide me the clue or code to do this in either flash or html?

website will be built in flash and publish as flash+html

thanks

 
Feb 12, 07 10:03 am
chupacabra

that site did it via a CSS attribute. There are million and one ways to do it though.

//
<style type="text/css">
body {
margin:0;
padding:0;
background:#ffffff;
}
table {
width:100%;
height:100%;
}
td {
vertical-align:middle;
text-align:center;
}

</style>

//

see the vertical align and text align elements

Feb 12, 07 10:08 am  · 
 · 
auvn

thanks jason
however I am using html code so I don't know this css code will help
I know the html code to center the site horizontally but not vertically. Couldn't figure out how to center both

Feb 12, 07 10:15 am  · 
 · 
carlos.pedro

You have to insert a table (1x1 cell) width 100% heigth 100%.
Put your flash inside the table.
Now you can center it both Vertically and Horizontally.

Feb 12, 07 10:27 am  · 
 · 
chupacabra

css code works in 'html'...it is not different.

what carlos is saying is exactly what the code above does minus the //
you can add the info directly in the html body or reference it via css in the head of the same file.

Feb 12, 07 10:31 am  · 
 · 
Client

no just:
<p align=center>
before the object tags

Feb 12, 07 11:22 am  · 
 · 
auvn

THANKS FOR YOUR RESPOND.
I still not be able to get it working. webpage only center horizontly, not vertically. I attached the html code below.


<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>01</title>
</head>
<body bgcolor="#ffffff">
<!--url's used in the movie-->
<!--text used in the movie-->
<!-- saved from url=(0013)about:internet -->
<p align=center>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="550" height="400" id="01" align="center">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="01.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#f0f0f0" /><embed src="01.swf" quality="high" bgcolor="#cccccc" width="550" height="400" name="01" align="center" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
</body>
</html>

Feb 12, 07 12:52 pm  · 
 · 

I go the tables way too, but use a table with one column and three rows. The middle row should be the same size as the image/flash/whatever you're going to drop in there, and the top and bottom rows should each be h=50%

Feb 12, 07 1:11 pm  · 
 · 
trace™

Easiest way:


make on big table - 100%, 100%, center

add a table inside of this one, make the exact size of the swf

stick the swf in this table


so it's a swf inside of a table inside of a table


Viola! The site will always center (css can only center it in one direction), even when you resize the browser.


It's an old trick, but it works.

Feb 12, 07 1:45 pm  · 
 · 
auvn

thanks trace
do I need dreamweaver or some other software to create the table

Feb 12, 07 2:09 pm  · 
 · 
Chch

just use

<table>
<tr>
<td width=100% height=100% align=center valign=middle>

at the start of your body content, and end it with


</td>
</tr>
</table>

stick the second table and swf code etc inbetween those two tag sets

Feb 12, 07 3:26 pm  · 
 · 
auvn

thanks for your help
I resolve the issue
the following threads give quite a good instruction to align centerlly - hope it is useful for others
http://www.htmlcodetutorial.com/help/ftopic7381.html

http://phrogz.net/CSS/vertical-align/index.html

Feb 12, 07 4:42 pm  · 
 · 

Block this user


Are you sure you want to block this user and hide all related comments throughout the site?

Archinect


This is your first comment on Archinect. Your comment will be visible once approved.

  • ×Search in: