Topic: Centering Opening Logo $Pages that link to <a href="https://ozoneasylum.com/backlink?for=9537" title="Pages that link to Topic: Centering Opening Logo" rel="nofollow" >Topic: Centering Opening Logo\$

Author	Thread
chudzta Bipolar (III) Inmate From: Williamsburg, VA Insane since: Aug 2002	posted 10-06-2002 21:12 alrighty.. was looking for a possible way to vertically align my opening logo http://chudzta.cjb.net right now im just using <br>'s to get it somewhat there..
kuckus Bipolar (III) Inmate From: Berlin (almost) Insane since: Dec 2001	posted 10-06-2002 21:45 The easiest way of doing that is putting everything you want to center into a table cell and then set its align and valign attributes to center/middle: code: <table width="100%" height="100%"> <tr> <td align="center" valign="middle"> <!-- centered content here --> </td> </tr> </table> Or, if you don't want to use table hacks for your layout, you could also center that box by putting it into a <div> and use some JavaScript positioning. Bugimus has a script on his homepage which does that job - http://www.bugimus.com/gurus/center_div.html. kuckus (cell #282)
Pugzly Paranoid (IV) Inmate From: 127.0.0.1 Insane since: Apr 2000	posted 10-06-2002 22:58 Here's how I do it. Put your image inside a div called "content". Using a div that we need to be 751x425, we use: <style type="text/css"> #content { position:absolute; text-align: center; border: 0px solid #000000; left: 50%; top: 50%; width: 751px; /* total width of the object / height: 425px; / total height of the object / margin-left: -375px; / width/2 / margin-top: -212px; / height/2 / } / The right value for Mozilla (right now these are the same as the IE values. I'll correct it later. This method takes advantage of the CSS bug. */ body>#content { margin-left: -375px; margin-top: -212px; } </style> This actually takes advantage of an IE bug to help Mozilla based stuff be set accordingly. This works great, and maintains center even when resized.
chudzta Bipolar (III) Inmate From: Williamsburg, VA Insane since: Aug 2002	posted 10-07-2002 02:52 umm call me a noob cuz i am where in that script does the mainlogo.jpg part go... it makes sense and im confident it will work... maybe i just need a full page script to comprehend completely
Pugzly Paranoid (IV) Inmate From: 127.0.0.1 Insane since: Apr 2000	posted 10-07-2002 04:23 In your doc, make <body> <div id="content"><img src="mainlogo.jpg" width="751" height="425" border="0" alt="" /></div> </body> That's all it takes. Adjust the width and height of the image AND the width & height of the div (in the style info) as needed. [This message has been edited by Pugzly (edited 10-07-2002).]
chudzta Bipolar (III) Inmate From: Williamsburg, VA Insane since: Aug 2002	posted 10-07-2002 22:02 oo oo , smacks myself.. anxious when i saw the post didnt interpret the first line on the first post correctly, i understand now tyvm
Genevieve Paranoid (IV) Inmate From: Santa Clara, CA, USA Insane since: Jul 2002	posted 10-09-2002 20:32 Why couldn't you just use <img src="image here" id="content"> instead of putting it in the div? Genevieve Wowzers! o.O Visit my cell! 754

Topic: Centering Opening Logo\$

Author

Thread

chudzta
Bipolar (III) Inmate

From: Williamsburg, VA
Insane since: Aug 2002

posted 10-06-2002 21:12

alrighty.. was looking for a possible way to vertically align my opening logo
http://chudzta.cjb.net

right now im just using <br>'s to get it somewhat there..

kuckus
Bipolar (III) Inmate

From: Berlin (almost)
Insane since: Dec 2001

posted 10-06-2002 21:45

The easiest way of doing that is putting everything you want to center into a table cell and then set its align and valign attributes to center/middle:

code:

<table width="100%" height="100%">

  <tr>

    <td align="center" valign="middle">



      <!-- centered content here -->



    </td>

  </tr>

</table>

Or, if you don't want to use table hacks for your layout, you could also center that box by putting it into a <div> and use some JavaScript positioning. Bugimus has a script on his homepage which does that job - http://www.bugimus.com/gurus/center_div.html.

kuckus (cell #282)

Pugzly
Paranoid (IV) Inmate

From: 127.0.0.1
Insane since: Apr 2000

posted 10-06-2002 22:58

Here's how I do it. Put your image inside a div called "content". Using a div that we need to be 751x425, we use:

<style type="text/css">
#content {
position:absolute;
text-align: center;
border: 0px solid #000000;
left: 50%;
top: 50%;
width: 751px; /* total width of the object */
height: 425px; /* total height of the object */
margin-left: -375px; /* width/2 */
margin-top: -212px; /* height/2 */
}

/*
The right value for Mozilla (right now these are the same as the IE values.
I'll correct it later.
This method takes advantage of the CSS bug.
*/

body>#content {
margin-left: -375px;
margin-top: -212px;
}
</style>

This actually takes advantage of an IE bug to help Mozilla based stuff be set accordingly. This works great, and maintains center even when resized.

chudzta
Bipolar (III) Inmate

From: Williamsburg, VA
Insane since: Aug 2002

posted 10-07-2002 02:52

umm call me a noob cuz i am where in that script does the mainlogo.jpg part go... it makes sense and im confident it will work... maybe i just need a full page script to comprehend completely

Pugzly
Paranoid (IV) Inmate

From: 127.0.0.1
Insane since: Apr 2000

posted 10-07-2002 04:23

In your doc, make
<body>
<div id="content"><img src="mainlogo.jpg" width="751" height="425" border="0" alt="" /></div>
</body>

That's all it takes. Adjust the width and height of the image AND the width & height of the div (in the style info) as needed.

[This message has been edited by Pugzly (edited 10-07-2002).]

chudzta
Bipolar (III) Inmate

From: Williamsburg, VA
Insane since: Aug 2002

posted 10-07-2002 22:02

oo oo , smacks myself.. anxious when i saw the post didnt interpret the first line on the first post correctly, i understand now tyvm

Genevieve
Paranoid (IV) Inmate

From: Santa Clara, CA, USA
Insane since: Jul 2002

posted 10-09-2002 20:32

Why couldn't you just use <img src="image here" id="content"> instead of putting it in the div?

Genevieve

Wowzers! o.O

Visit my cell! 754

Post Reply

Your User Name:
Your Password:
Login Options:	Remember Me On This Computer

Your Text: Insert Slimies » Insert UBB Code » Close Last Tag \| All Tags UBB Help	Loading...
Options:	Show Signature Enable Slimies Enable Linkwords

Topic: Centering Opening Logo

Insert Slimies »

Insert UBB Code »

Topic: Centering Opening Logo $Pages that link to <a href="https://ozoneasylum.com/backlink?for=9537" title="Pages that link to Topic: Centering Opening Logo" rel="nofollow" >Topic: Centering Opening Logo\$