Library code snippets
Centre Aligning a Block Element
Say you wanted to have a fixed width layout website, and the content floated in the middle of the screen. You can use the following CSS command:
#content
{
width: 700px;
margin: 0 auto
}
You would then enclose <div id="content"> around every item in the body of the HTML
document and it'll be given an automatic margin on both its left and
right, ensuring that it's always placed in the centre of the screen.
Simple... well not quite - we've still got the pre-IE 6 versions on PC to worry about, as these browsers won't centre align the element with this CSS command. You'll have to change the CSS rules:
body {
text-align: center
}
#content
{
text-align: left;
width: 700px;
margin: 0 auto
}
This
will then centre align the main content, but it'll also centre align
the text! To offset the second, probably undesired, effect we inserted text-align: left into the content div.
Related articles
Related discussion
-
Inserting checkbox values into one field
by ramsenthil2000 (1 replies)
-
How to do we process these things like web hosting?web development?
by ephraimgasel (0 replies)
Related podcasts
-
Top Web Design Mistakes
Pete LePage is Product Manager of Internet Explorer Developer Division and he doesn’t want your web site to stink. Sharing from his talk given at TechEd 2008, Pete highlights 10 common web design mistakes and tells you how you can bypass the same blunders. Pete also tells us how future features o...
Events coming up
-
Jul
29
July Web Design Meetup
Gig Harbor, United States
Anyone interested in web design or development can attend: whether you're a website owner, a full or part-time designer or developer, or a student. We're meeting at the Pierce County Library again since they have a large meeting room and free wireless access. Please RSVP if you plan to attend. Agenda We'll have a helping of our normal, free-form discussion, but we're also planning to have a few highlight discussions, which will be announced closer to the meetup.
This thread is for discussions of Centre Aligning a Block Element.