Align text in a table header

Question

It seems align is not working for the th element  Here is my HTML    x000D   x000D   lt div style  width  100   height  175px  overflow  auto   gt  x000D     lt table class  grid  id  table  gt  x000D       lt thead gt  x000D         lt tr gt  x000D           lt th class  not mapped style  style  display  none   align  center  gt id lt  th gt  x000D           lt th class  not mapped style  align  center  gt DisplayName lt  th gt  x000D           lt th align  center  gt PrimaryEmail lt  th gt  x000D           lt th align  center  gt Age lt  th gt  x000D           lt th align  center  gt Phone lt  th gt  x000D         lt  tr gt  x000D       lt  thead gt  x000D       lt caption gt Contacts lt  caption gt  x000D       lt tbody gt  x000D         lt tr gt  x000D           lt td style  display  none   property value  0  property name  id  align  center  gt 0 lt  td gt  x000D           lt td property value  rpcuser  property name  DisplayName  align  center  gt rpcuser lt  td gt  x000D           lt td property value  admin domain com  property name  PrimaryEmail  align  center  gt admin domain com lt  td gt  x000D           lt td property value  69  property name  Age  align  center  gt 69 lt  td gt  x000D           lt td property value   722616807  property name  Hand Phone  align  center  gt  18007 lt  td gt  x000D         lt  tr gt  x000D       lt  tbody gt  x000D     lt  table gt  x000D   lt  div gt  x000D   x000D   x000D    Text aligning is working just fine for the td elements but fails for the th  Why

User · Answer

If you want to center the th of all tables  table th  text-align  center     If you only want to center the th of a table with a determined id  table tableId th  text-align  center

User · Answer

In HTML5  the easiest  and fastest  way to center your  lt th gt THcontent lt  th gt  is to add a colspan like this    lt th colspan  3  gt Thcontent lt  th gt     This will work if your table is three columns  So if you have a four-column table  add a colspan of 4  etc   You can manage the location furthermore in the CSS file while you have put your colspan in HTML like I said     th        text-align  center     Or right or left

User · Answer

Your code works  but it uses deprecated methods to do so  You should use the CSS text-align property to do this rather than the align property  Even so  it must be your browser or something else affecting it  Try this demo in Chrome  I had to disable normalize css to get it to render     Source  http   jsfiddle net EDSWL  Demo  http   jsfiddle net EDSWL show

User · Answer

Try using style for th  th  text-align center

User · Answer

HTML     lt tr gt       lt th gt Language lt  th gt       lt th gt Skill Level lt  th gt       lt th gt  amp nbsp  lt  th gt   lt  tr gt    CSS    tr  th       padding  10px      text-align  center

User · Answer

For me none of the above worked  I think it is because I have two levels of header and a fixed width on level 1  So I couldn t align the text inside the corresponding columns on level 2     ---------------------------              lvl 1              ---------------------------    lvl 2 col a   lvl 2 col b    ---------------------------    I had to use the combination of width auto and text align-center     lt th style  width auto text-align center  gt lvl 2 col a lt  th gt   lt th style  width auto text-align center  gt lvl 2 col b lt  th gt

User · Answer

Try to use text-align in style attribute to align center    lt th class  not mapped style  style  text-align center  gt DisplayName lt  th gt

User · Answer

Try   text-align  center    You may be familiar with the HTML align attribute  which has been discontinued as of HTML 5   The align attribute could be used with tags such as    lt table gt    lt td gt   and  lt img gt     to specify the alignment of these elements  This attribute allowed you to align elements horizontally  HTML also has had a valign attribute for aligning elements vertically  This has also been discontinued from HTML5   These attributes were discontinued in favor of using CSS to set the alignment of HTML elements   There isn t actually a CSS align or CSS valign property  Instead  CSS has the text-align which applies to inline content of block-level elements  and vertical-align property which applies to inline level and table cells

[html] Align text in a table header

Examples related to html

Examples related to html-table