/    Sign up×
Community /Pin to ProfileBookmark

Centering Layout

Copy linkTweet thisAlerts:
Jun 18.2006

hey can someone tell me the best way to center this website?
[url]http://greyfilmpro.com/steve/index[/url] I attached the style sheet.

[upl-file uuid=52e92b18-d5d4-4327-812f-05f66920cc59 size=535B]style.zip[/upl-file]

to post a comment
CSS

11 Comments(s) ↴

Copy linkTweet thisAlerts:
@CytaelJun 18.2006 — first, change all your absolute positioning to relative, then add to your CSS:

[code=php]
BODY { margin: 0 auto; width: 999px; }
/* change width to match width of content area of your page */
[/code]
Copy linkTweet thisAlerts:
@TehShlockerJun 18.2006 — couldn't you just add <center></center> after and before the body tags?
Copy linkTweet thisAlerts:
@GreyFilmProauthorJun 18.2006 — so where does that code go? the body one
Copy linkTweet thisAlerts:
@TehShlockerJun 18.2006 — [FONT=Times New Roman][SIZE=3][COLOR=Blue][B]

Okay here's an example:

[code=html]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>

<BODY> <--Here are the body tags
<cemter> <-- try placing the center code here

...
Website code here
more website code here
...

</center> <--and the close center tag here
</BODY> <--Here are the body tags
</HTML>
[/code]
[/B][/COLOR][/SIZE][/font]
Copy linkTweet thisAlerts:
@GreyFilmProauthorJun 18.2006 — nope that doesnt work TehShlocker.
Copy linkTweet thisAlerts:
@jmilin5931Jun 18.2006 — are you using tables? Center your whole table(s)
Copy linkTweet thisAlerts:
@GreyFilmProauthorJun 18.2006 — no im using layers not tables.
Copy linkTweet thisAlerts:
@WebJoelJun 18.2006 — hey can someone tell me the best way to center this website?

http://greyfilmpro.com/steve/index I attached the style sheet.[/QUOTE]

[I]Don't[/I] use "<center>"~"</center>". This is deprecated (old, out-of-date) and is you use a STRICT !doctype, you'll throw errors. ?

Surround your page with a DIV. Let's call this a 'wrapper'.

<body>

[B]<div style="width:90%; margin:0 auto;">[/B]<!-- wraps entire page content from opening BODY tag, to closing BODY tag -->

-Your site content goes in here-

[B]</div>[/B]<!-- end WRAPPER -->

</body>

This works, and is valid. But in order to have auto-adjusting left-right margins ("centering"), you must also declare a width. I chose [B]90%[/B], but you can make it whatever you want.

-Joel
Copy linkTweet thisAlerts:
@GreyFilmProauthorJun 18.2006 — I did that but it still isnt centering..... ?
Copy linkTweet thisAlerts:
@kaurotuJun 18.2006 — did you even try what cytael said before about the body?
Copy linkTweet thisAlerts:
@GreyFilmProauthorJun 19.2006 — yes I did, Ive tried every suggestion on this page and nothing has worked.
×

Success!

Help @GreyFilmPro spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.4,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...