PDA

View Full Version : trouble getting html to center flash site


SteelCity
May 1st, 2008, 02:28 AM
What do I need to change in this html
.... to get my webpage to be centered. Currently it's line up to the left. I have done some searches, and tried to change different things, but my lack of any html knowledge hinders me. below is the portion of my html script that I think is the culprit.please help

</script>
<noscript>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/s...ersion=9,0,0,0 (http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0)" width="900" height="850" id="wire1" align="top">
<param name="allowScriptAccess" value="sameDomain" />
<param name="allowFullScreen" value="false" />
<param name="movie" value="wire1.swf" /><param name="quality" value="high" /><param name="scale" value="noscale" /><param name="bgcolor" value="#ffffff" /> <embed src="wire1.swf" quality="high" scale="noscale" bgcolor="#ffffff" width="900" height="850" name="wire1" align="top" allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
</noscript>
</body>
</html>



Please be specific is your could since I know absolutedly nothing about html syntax or coding.

Thank you so much
moodie
May 1st, 2008, 02:35 AM
the two things you need are:

dead centre:
http://www.wpdfd.com/editorial/thebox/deadcentre3.html (just view the source)

&

SWFOBJECT
http://code.google.com/p/swfobject/
SteelCity
May 1st, 2008, 09:33 AM
clarification plz.

making my current swf dead center means that I need to do what?
SteelCity
May 1st, 2008, 09:37 AM
what in this source code do I need to leave the same, my swf is 850 wide x 900 tall. And it is in the same folder as the index.html.


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>




<meta http-equiv="content-type" content="text/html;charset=ISO-8859-1"><title>Dead Centre</title>

<style type="text/css" media="screen"><!--
body
{
color: white;
background-color: #003;
margin: 0px
}

#horizon
{
color: white;
background-color: transparent;
text-align: center;
position: absolute;
top: 50%;
left: 0px;
width: 100%;
height: 1px;
overflow: visible;
visibility: visible;
display: block
}

#content
{
font-family: Verdana, Geneva, Arial, sans-serif;
background-color: transparent;
margin-left: -125px;
position: absolute;
top: -35px;
left: 50%;
width: 250px;
height: 70px;
visibility: visible
}

.bodytext
{
font-size: 14px
}

.headline
{
font-weight: bold;
font-size: 24px
}

#footer
{
font-size: 11px;
font-family: Verdana, Geneva, Arial, sans-serif;
text-align: center;
position: absolute;
bottom: 0px;
left: 0px;
width: 100%;
height: 20px;
visibility: visible;
display: block
}

a:link, a:visited
{
color: #06f;
text-decoration: none
}

a:hover
{
color: red;
text-decoration: none
}

--></style></head><body>
<div id="horizon">
<div id="content">
<div class="bodytext">
This text is<br>
<span class="headline">DEAD CENTRE</span><br>
and stays there!</div>
</div>
</div>
<div id="footer">
<a href="http://www.wpdfd.com/editorial/thebox/deadcentre4.html">view construction</a></div>
</body></html>
SteelCity
May 1st, 2008, 09:50 AM
Here is how I built my .swf

I set the size then I centered the background to the stage. So my swft is centered on the stage. I just can't see why it's so difficult to center it to the webpage browser.

A little more help plz?
fasterthanlight™
May 1st, 2008, 10:09 AM
The CSS you need to modify:


#content
{
font-family: Verdana, Geneva, Arial, sans-serif;
background-color: transparent;
margin-left: -425px;
position: absolute;
top: -450px;
left: 50%;
width: 850px;
height: 900px;
visibility: visible
}
The HTML you need to modify:


<div id="horizon">
<div id="content">
<div class="bodytext">
THIS IS WHERE YOU COPY AND PASTE YOUR FLASH EMBED CODE
</div>
</div>
</div>
<div id="footer">
<a href="http://www.wpdfd.com/editorial/thebox/deadcentre4.html">view construction</a></div>
</body></html>


You can replace the above CSS code I gave you with the corresponding block of CSS in your file, and all you need to do is copy and paste your flash code into <div class="bodytext"> </div>

while removing the text thats already in there

(This text is<br>
<span class="headline">DEAD CENTRE</span><br>
and stays there!)

do not remove any </div>
SteelCity
May 1st, 2008, 01:07 PM
I can't beleive I'm this dumb, but what is my Flash embed code?

Here is my index in it's entirety, what portion of it should be inserted after <div class="bodytext">

Could you highlight the portion in red?

<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>wire1</title>
<script language="javascript">AC_FL_RunContent = 0;</script>
<script src="AC_RunActiveContent.js" language="javascript"></script>
</head>
<body bgcolor="#ffffff">
<!--url's used in the movie-->
<!--text used in the movie-->
<!-- saved from url=(0013)about:internet -->
<script language="javascript">
if (AC_FL_RunContent == 0) {
alert("This page requires AC_RunActiveContent.js.");
} else {
AC_FL_RunContent(
'codebase', 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0',
'width', '900',
'height', '850',
'src', 'wire1',
'quality', 'high',
'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'align', 'top',
'play', 'true',
'loop', 'true',
'scale', 'noscale',
'wmode', 'window',
'devicefont', 'false',
'id', 'wire1',
'bgcolor', '#ffffff',
'name', 'wire1',
'menu', 'true',
'allowFullScreen', 'false',
'allowScriptAccess','sameDomain',
'movie', 'wire1',
'salign', ''
); //end AC code
}
</script>
<noscript>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="900" height="850" id="wire1" align="top">
<param name="allowScriptAccess" value="sameDomain" />
<param name="allowFullScreen" value="false" />
<param name="movie" value="wire1.swf" /><param name="quality" value="high" /><param name="scale" value="noscale" /><param name="bgcolor" value="#ffffff" /> <embed src="wire1.swf" quality="high" scale="noscale" bgcolor="#ffffff" width="900" height="850" name="wire1" align="top" allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
</noscript>
</body>
</html>
SteelCity
May 1st, 2008, 01:24 PM
Problem solved and here's how
& right before that code was probably a line like :

Code:

<body bgcolor="#ffffff">


The simplest way to do it would be to put :

Code:

<div align="center">

right under that
Code:

<body bgcolor="#ffffff">

bit.
Then down at the bottom of the code you pasted you'll see :

Code:

</object></noscript></body></html>

So put the closing tag
Code:

</div>

right before that last </body> tag, which will look like :

Code:

</object></noscript></div></body></html>


& your Flash site will be magically centered!

by gotoAndCrash
fasterthanlight™
May 1st, 2008, 01:37 PM
Yea, thats the way to horizontally center it, the other guys who replied here assumed you wanted it vertically centered, so yea, the way you have it, works