How to Center Web Page Content Using CSS

Do you want to center your website content to create equal sized borders to the left and right but want the text to remain left justified? Read on!

Method 1
Method 1 of 1:

Centering Web Page Content

  1. Image titled Center Web Page Content Using CSS Step 1
    1
    Open Notepad or a comparable text editing application.
  2. Image titled Center Web Page Content Using CSS Step 2
    2
    Create the basic HTML skeleton of the website.
    Advertisement
  3. Image titled Center Web Page Content Using CSS Step 3
    3
    Within the <head> </head> tags add the following style definition.
  4. Image titled Center Web Page Content Using CSS Step 4
    4
    Inside the <body></body> tags add the following div tags.
  5. Image titled Center Web Page Content Using CSS Step 5
    5
    Place any content for the site between the <div> </div> tags.
  6. Image titled Center Web Page Content Using CSS Step 6
    6
    Finished product:
  7. Image titled Center Web Page Content Using CSS Step 7
    7
    Save your file with the extension .htm or .html and you're all done.
    8. Advertisement

Community Q&A

  • Question
    Can a .css file be saved as .css, or it should be saved as .html?
    Community Answer
    Community Answer
    A .css file should be saved as a .css file, with no exceptions.
  • Question
    Can a .css file be saved as .css, or it should be saved as .html? Actually you can add into the head of your HTML file and put your CSS there.
    AD Developers
    AD Developers
    Community Answer
    CSS files are different from HTML files. If you write your CSS code you should save it as CSS file with css as suffix. But if you write CSS code inside a HTML document you should save the document as HTML file with html or htm suffix. Just remember you can not include HTML tags or JavaScript tags in your CSS document.
  • Question
    How can someone create an image gallery?
    Free Eagle
    Free Eagle
    Community Answer
    1.) Log into your websites cPanel. 2.) Click on Softaculous Apps Installer. 3.) Click on Image Galleries 4.) Choose a gallery to host your images. 5.) You will then be able to upload pictures to your gallery, and link to the gallery from your website. You will receive detail instructions with each gallery.
Advertisement

You Might Also Like

Use HTML and CSS
How to
Use HTML and CSS
Insert a HyperlinkHow to Insert a Hyperlink Using Rich Text or HTML: 3 Methods
Make a Birthday Card with HTML and CSS
How to
Make a Birthday Card with HTML and CSS
Upload Images in BBCode
How to
Upload Images in BBCode
Comment in CSS
How to
Comment in CSS
Create a Simple CSS Stylesheet Using Notepad
How to
Create a Simple CSS Stylesheet Using Notepad
Create a Dropdown Menu in HTML and CSS
How to
Create a Dropdown Menu in HTML and CSS
Use DIV and Span in HTML and CSS
How to
Use DIV and Span in HTML and CSS
Use BBCode
How to
Use BBCode
Define a CSS Class Style
How to
Define a CSS Class Style
Add JavaScript to Your Website Using HTML
How to
Add JavaScript to Your Website Using HTML
Create CSS
How to
Create CSS
Add a CSS File to HTML
How to
Add a CSS File to HTML
Change a Webpage Text Font and Color Using CSS
How to
Change a Webpage Text Font and Color Using CSS
Advertisement

About This Article

wikiHow is a “wiki,” similar to Wikipedia, which means that many of our articles are co-written by multiple authors. To create this article, 21 people, some anonymous, worked to edit and improve it over time. This article has been viewed 224,367 times.
How helpful is this?
Co-authors: 21
Updated: June 10, 2022
Views: 224,367
Categories: Featured Articles | Markup Languages
Advertisement