Topic on Project:Support desk

how to center the table on page

5
D3Molay (talkcontribs)
Cavila (talkcontribs)

As far as I'm aware, "float:center" is not permitted in CSS, but you simply put center tags around the table:

<center>
Table here
</center>
Krinkle (talkcontribs)

float: center; does not exist. A float can be either to the left or the right.

<center> has been deprecated and no longer supported in HTML5, don't use it. To center something, the correct way is to use CSS, automatic margin. It may sound odd at first but this is how centering is done all over the web for years now and is in fact what browsers do now when they render an old <center> tag.


<div style="background: #0645AD; width: 50px; height: 50px; margin: 0 auto; color: #fff; padding: 1em;">π</div>

π
Cavila (talkcontribs)

Thanks for the heads up. I don't know a lot about HTML and CSS, so I'm wondering which of these would be recommended practice: putting a div style around the table (as in A below) or adding the style internally to the table element (as in B below)?

A

<div style="width: 50px; height: 50px; margin: 0 auto;">
{|
|-
| A
| B
|-
| C
| D
|}</div>
A B
C D

B

{| style="width: 50px; height: 50px; margin: 0 auto;"
|-
| A
| B
|-
| C
| D
|}
A B
C D
Krinkle (talkcontribs)

Doesn't matter. If you need to center multiple elements, it is easier to wrap them together in a <div>. Otherwise you can just put the style on the one element directly.

Reply to "how to center the table on page"