Question

Possible Duplicate:
How is this put in the center using CSS?

I have tried so hard to put things in the center in CSS but I just dont get it!

I dont want to use <center></center>

So how else is it done?

Answer 1

So what is the EASIEST, CLOSEST option to writing <center></center>?

Probably something like this:

element {
    display:block;
    text-align:center;
}

References:

• Google Chrome stylesheet: http://codesearch.google.com/codesearch#OAMlx_jo-ck/src/third_party/WebKit/Source/WebCore/css/html.css

  center {
      display: block;
      /* special centering to be able to emulate the html4/netscape behaviour */
      text-align: -webkit-center
  }
  

• Firefox stylesheet: http://mxr.mozilla.org/mozilla-central/source/layout/style/html.css

  center {
      display: block;
      text-align: -moz-center;
  }
  

Why not to use the <center> tag

• It is a “presentational” tag that has absolutely no semantic value.
• It is deprecated. While support for it may continue, it is not guaranteed (this is up to the browser vendor).

• As a presentational tag, it makes very little sense to have to do something like:

  center {
      text-align:left;
  }
  

Presentation should always be delegated to CSS when possible (i.e. almost always).

There are a variety of ways to “center” different things in different ways, but this should emulate the <center> tags behavior.