How to center a checkbox in a table cell

Question

The cell contains nothing but a checkbox  It is rather wide because of text in the table header row  How do I center the checkbox  with inline CSS in my HTML   I know    I tried      lt td gt         lt input type  checkbox  name  myTextEditBox  value  checked         style  margin-left auto  margin-right auto   gt    lt  td gt    but that didn t work   What am I doing wrong       Update  here s a test page  Can someone please correct it - with CSS inline in the HTML - so that the checkboxes are centered in their columns       lt  DOCTYPE HTML PUBLIC  -  W3C  DTD HTML 4 0 Transitional  EN  gt   lt html gt   lt head gt   lt title gt Alignment test lt  title gt   lt  head gt   lt body gt    lt table style  empty-cells hide  margin-left auto  margin-right auto   border  1    cellpadding  1  cellspacing  1  gt      lt tr gt       lt th gt Search  lt  th gt  lt th gt Field lt  th gt  lt th colspan  2  gt Search criteria lt  th gt  lt th gt Include in report  lt br gt  lt  th gt     lt  tr gt      lt tr gt       lt td gt           lt input type  checkbox  name  query myTextEditBox  style  text-align center  vertical-align  middle   gt           lt  td gt        lt td gt        myTextEditBox      lt  td gt        lt td gt          lt select size   1  name  myTextEditBox compare operator  gt           lt option value     gt equals lt  option gt           lt option value   lt  gt   gt does not equal lt  option gt          lt  select gt       lt  td gt        lt td gt         lt input type  text  name  myTextEditBox compare value  gt       lt  td gt        lt td gt         lt input type  checkbox  name  report myTextEditBox  value  checked  style  text-align center  vertical-align  middle   gt       lt  td gt      lt  tr gt    lt  table gt     lt  body gt   lt  html gt      I have accepted  Hristo s answer - and here it is with inline formatting         lt table style  empty-cells hide   border  1    cellpadding  1  cellspacing  1  gt        lt tr gt           lt th gt Search  lt  th gt  lt th gt Field lt  th gt  lt th colspan  2  gt Search criteria lt  th gt  lt th gt Include in report  lt br gt  lt  th gt       lt  tr gt        lt tr gt           lt td style  text-align  center  vertical-align  middle   gt               lt input type  checkbox  name  query myTextEditBox  gt               lt  td gt            lt td gt              myTextEditBox          lt  td gt            lt td gt               lt select size   1  name  myTextEditBox compare operator  gt                   lt option value     gt equals lt  option gt                   lt option value   lt  gt   gt does not equal lt  option gt               lt  select gt           lt  td gt            lt td gt               lt input type  text  name  myTextEditBox compare value  gt           lt  td gt            lt td style  text-align  center  vertical-align  middle   gt               lt input type  checkbox  name  report myTextEditBox  value  checked  gt           lt  td gt        lt  tr gt    lt  table gt

User · Accepted Answer

How about this    http   jsfiddle net gSaPb   Check out my example on jsFiddle  http   jsfiddle net QzPGu  Code snippet   x000D   x000D  td     text-align  center       center checkbox horizontally      vertical-align  middle       center checkbox vertically       table     border  1px solid    width  200px     tr     height  80px    x000D   lt table gt     lt tr gt       lt td gt         lt input type  checkbox  name  myTextEditBox  value  checked    gt  checkbox      lt  td gt     lt  tr gt   lt  table gt  x000D   x000D   x000D

How to center a checkbox in a table cell?

The Solution to How to center a checkbox in a table cell? is

Most Viewed Questions: