Easy way to center HTML page... - GoFuckYourself.com

zoltie · 04-28-2006, 01:42 PM

Can you guys tell me how to center a html page. The page below looks ok in 800 by 600 but looks off if you use 1024 by 768 or higher. Haw do I make it center regardless of resolution.

html code:

<HTML>
<HEAD>
<TITLE>test</TITLE>
<META NAME="description" CONTENT="test">
<BASE TARGET="_top">
<STYLE TYPE="text/css">BODY {margin-left:0; margin-right:0; margin-top:0;}</STYLE>
</HEAD>

<BODY SCROLL="auto" BGCOLOR="#000000" TOPMARGIN=0 LEFTMARGIN=0>

<DIV ID="idElement1" style="position:absolute; top:88px; left:233px; width:324px; height:233px;"><IMG SRC="up-trailer_park_boys.jpg" NAME="idElement1Img" ID="idElement1Img" WIDTH=324 HEIGHT=233 BORDER=0></DIV>

</BODY>
</HTML>

StuartD · 04-28-2006, 01:46 PM

A quick and easy way is like this:

<Center>
<DIV ID="idElement1" style="position:relative; top:88px; width:324px; height:233px;"><IMG SRC="up-trailer_park_boys.jpg" NAME="idElement1Img" ID="idElement1Img" WIDTH=324 HEIGHT=233 BORDER=0></DIV>
</center>

Otherwise, there's no real way to have a "center" option for a div quite like that.. especially if you're using "absolute" as a position setting.

aico · 04-28-2006, 01:52 PM

I just threw up in my mouth.

Validus · 04-28-2006, 02:02 PM

Quote:

Originally Posted by zoltie

Can you guys tell me how to center a html page. The page below looks ok in 800 by 600 but looks off if you use 1024 by 768 or higher. Haw do I make it center regardless of resolution.

html code:

<HTML>
<HEAD>
<TITLE>test</TITLE>
<META NAME="description" CONTENT="test">
<BASE TARGET="_top">
<STYLE TYPE="text/css">BODY {margin-left:0; margin-right:0; margin-top:0;}</STYLE>
</HEAD>

<BODY SCROLL="auto" BGCOLOR="#000000" TOPMARGIN=0 LEFTMARGIN=0>

<DIV ID="idElement1" style="position:absolute; top:88px; left:233px; width:324px; height:233px;"><IMG SRC="up-trailer_park_boys.jpg" NAME="idElement1Img" ID="idElement1Img" WIDTH=324 HEIGHT=233 BORDER=0></DIV>

</BODY>
</HTML>

try...

Code:

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

<HTML>
<HEAD>
<TITLE>test</TITLE>
<META NAME="description" CONTENT="test">
<BASE TARGET="_top">

</HEAD>

<BODY style="background-color:#000000; margin:0px; padding:0px;">


<DIV ID="idElement1" style="text-align:center;">
	<IMG SRC="up-trailer_park_boys.jpg" NAME="idElement1Img" ID="idElement1Img" style="width:324px; height:233px; border:0px;" />
</DIV>


</BODY>
</HTML>

tip... don't CAP everything... and don't double up on styles.

Validus · 04-28-2006, 02:05 PM

Actually, you might want to add a width:100%; to the DIV tag...

Code:

<DIV ID="idElement1" style="text-align:center; width:100%;">

04-28-2006, 01:42 PM	#1
zoltie So Fucking Banned Join Date: May 2002 Posts: 855	Easy way to center HTML page... Can you guys tell me how to center a html page. The page below looks ok in 800 by 600 but looks off if you use 1024 by 768 or higher. Haw do I make it center regardless of resolution. html code: <HTML> <HEAD> <TITLE>test</TITLE> <META NAME="description" CONTENT="test"> <BASE TARGET="_top"> <STYLE TYPE="text/css">BODY {margin-left:0; margin-right:0; margin-top:0;}</STYLE> </HEAD> <BODY SCROLL="auto" BGCOLOR="#000000" TOPMARGIN=0 LEFTMARGIN=0> <DIV ID="idElement1" style="position:absolute; top:88px; left:233px; width:324px; height:233px;"><IMG SRC="up-trailer_park_boys.jpg" NAME="idElement1Img" ID="idElement1Img" WIDTH=324 HEIGHT=233 BORDER=0></DIV> </BODY> </HTML>

04-28-2006, 01:46 PM	#2
StuartD Sofa King Band Join Date: Jul 2002 Location: Outside the box Posts: 29,903	A quick and easy way is like this: <Center> <DIV ID="idElement1" style="position:relative; top:88px; width:324px; height:233px;"><IMG SRC="up-trailer_park_boys.jpg" NAME="idElement1Img" ID="idElement1Img" WIDTH=324 HEIGHT=233 BORDER=0></DIV> </center> Otherwise, there's no real way to have a "center" option for a div quite like that.. especially if you're using "absolute" as a position setting. __________________ This is me on facebook This is me on twitter

04-28-2006, 02:05 PM	#5
Validus Confirmed User Industry Role: Join Date: Jul 2001 Location: Calgary, Canada Posts: 4,012	Actually, you might want to add a width:100%; to the DIV tag... Code: <DIV ID="idElement1" style="text-align:center; width:100%;">

04-28-2006, 01:52 PM	#3
aico Moo Moo Cow Join Date: Mar 2004 Location: Washington State Posts: 14,748	I just threw up in my mouth.