Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS replacement for <div align="center">

I know this question has been asked many times, but I never saw a satisfactory answer. I mean, an answer that actually works.

So, here we go again. Take this jsFiddle: http://jsfiddle.net/KFMyn/3/

If you remove the align="center" from the HTML, what CSS do you need to use to make the result look the same as the original?

The answers I found usually amount to margin:0 auto and/or text-align:center but neither of those have the desired effect of making the result look the same as the original.

like image 806
Mr Lister Avatar asked Feb 29 '12 13:02

Mr Lister


People also ask

How do I center align a div tag in CSS?

You can do this by setting the display property to "flex." Then define the align-items and justify-content property to “center.” This will tell the browser to center the flex item (the div within the div) vertically and horizontally.

How do I center a div without CSS?

use text-align:center for div -> this will align text inside div center. include width property in div (i.e. width:200px) and it will work fine.

Is Align Center deprecated?

The CENTER element is deprecated because basically a it's a purely presentational tag rather than structural and is similar to shorthand for 'DIV align=center' which is better handled via CSS.

What is the alternative of center tag?

If you want center align an element, you should use css instead. You can use text-align property of css to change alignment of elements. In this example, I'm using id attribute to set alignment of paragraph. Instead of that, you may use any other css selector like class, tag name or any other indirect selectors.


1 Answers

The text align center covers most of the text elements but a little extra is needed to centre align the table

div {width:400px; text-align:center;} table {margin: 0 auto;} table td {text-align: left;} 

http://jsfiddle.net/NYuv8/4/

like image 184
Paul Sheldrake Avatar answered Oct 03 '22 00:10

Paul Sheldrake