Solution: How To center your website in HTML/CSS

8 replies
  • |
Hi there Fellow Warriors,

Many a time, i have seen people around here having problems to center their website or if they actually get it centered in one browser they are not able to in the rest.

I am a designer myself and before this post, i used to charge around $10 for centering webpages. But today i feel like giving something back to the warrior members, these are a few sites i refer to when centering pages.
Here's the list:

For Horizontal Centering:
Max Design - CSS Centering - fun for all!
CSS Centering: Auto-width Margins
SimpleBits ~ CSS Centering 101
Andy Budd::Blogography: CSS Crib sheet #3 - Centering a Div
Centering Block Element - css-discuss
All My FAQs Wiki: Center with CSS

And For vertical Centering:
How to: vertical centering with CSS / journal / hicksdesign
Vertical Centering in CSS
Permanently outdated - Alsacrations

If you think this post was useful, Do thank me.

And i think this should be put up as a sticky , so that people dont have to search or make a post again related to this.

#center #html or css #simple #solution #website
  • Profile picture of the author pdjsolutions
    No Problem .

    If anyone needs help implementing these , feel free to contact me and i will you out

    {{ DiscussionBoard.errors[1060977].message }}
  • Profile picture of the author WebStranica
    Centering web page horizontally.


    #window {
        margin: 0px auto;
    {{ DiscussionBoard.errors[1061114].message }}
  • Profile picture of the author kendrickyi
    It's possible to use tables right?
    We can put all the web content inside a table or div
    and put that table in the center.
    Like this.
    <table style="border: 5px dashed; border-color: black;" align="center" width="55%" cellPadding="1" cellspacing="10">
    That's what I've done for my projects in school in the past. I do that now too.

    "My Affiliate Marketing Mini Course To Help You Start An Affiliate Marketing Business That Could Generate Passive Affiliate Income For You Every Month, Even If You Are An Internet Newbie!"

    Unlock The Secrets To Wealth Now!

    {{ DiscussionBoard.errors[1061419].message }}
    • Profile picture of the author Steve Diamond
      Originally Posted by kendrickyi View Post

      It's possible to use tables right?
      Professional web designers stopped using tables for layout during the 2003 - 2006 timeframe, as browsers became more mature and offered full support for CSS 2.0. For some of the reasons why Google semantic markup and tableless design.

      Bottom line: don't. Not unless you want to look like a hobbyist who's stuck in the 20th century.

      Mindfulness training & coaching online
      Reduce stress | Stay focused | Keep positive and balanced
      {{ DiscussionBoard.errors[1061582].message }}
  • Profile picture of the author pdjsolutions
    @kendrickyi - I dont personally like tables and i find it difficult to actually design them. Also what you have stated does not work really go well with all the browsers and also , when the designing gets deeper, simple codes like those dont work. I used to think the same , but when i experienced issues, i understood.

    @Webstranica - That does not go well with all the browsers and does not work all the time, its not as easy as you have stated. Have a look at the links.

    You will understand
    {{ DiscussionBoard.errors[1061541].message }}
  • Profile picture of the author snazzie
    Great information, thanks for sharing!
    {{ DiscussionBoard.errors[1062510].message }}
  • Profile picture of the author pdjsolutions

    Thanks for that piece of advice, just didnt know how to put it forward
    {{ DiscussionBoard.errors[1116592].message }}
  • Profile picture of the author cheesy
    Thanks for the tips guys, should help when im trying to center the gallery for my design portfolio xD
    *NEW* Automatic Social Bookmarking Sofware? coming-soon Q3...
    {{ DiscussionBoard.errors[1116837].message }}

Trending Topics