Learn HTML step-by-step from A to Z or improve your professional skills.  Home HTML and CSS Tutorials CSS Centering
Your Ad Here

CSS Centering


CSS CenteringThis tutorial will show you how to center you website design in all browsers.

Step One

Create a website design, once you've created your layout in Photoshop. You need to code it and save it into the correct format. Example: .php, .html, .asp

Step Two

Create a CSS Stylesheet and link to it in the top of your design, use the code below to link to an external stylesheet. Save the style sheet as "style.css".

You need to paste the below code into the < head > tag of your page.

<link media="screen" type="text/css" href="/img_articles/10014/style.css" rel="stylesheet">

Step Three

Add the below CSS into your CSS document: This code instructs both browsers to center anything inside the tags to be centered.

body
{
text-align: center; */ Centers in IE */
}
#container
{
margin: 0 auto; */Centers in FF */
}

Step Three

You now need to add the below code into the design you created.

You need to replace the " with the body part of your design.

<body>
<div id="container">
<!-- Content Here -->
</div>
</body>

Finished

That’s it! Everything inside those two tags will be centered in the middle of the window in both Internet Explorer and Firefox.

I hope this helps!



Author's URL: Escrima
Thank you for voting.
Rate this Materials:
Bad 
1 2 3 4 5 Excellent
Share print this page subscribe to newsletter subscribe to rss

Learn HTML step-by-step from A to Z or improve your professional skills. More HTML and CSS: Most Popular Materials | Fresh Materials | More HTML Tutorials at Markuptutorials.com

No comments yet...
Add comments to "CSS Centering"

Captcha