How do I set table border width with CSS

Question

Why does this work    lt table border 1 gt    And this doesn t    lt table style  border-width 1px border-color black  gt    I get the same result in Chrome and in IE9

User · Answer

The default border-style is none  so you must specify that as well as the width and the colour   You can use the border shorthand property to set all three values in one go   Also  the border attribute describes the border for the table and the cells  CSS is much more flexible so it only describes the border of the elements you are selecting  You need to select the cells too in order to get the same effect   table  th  td       border  solid black 1px      See also border properties and tables in CSS

User · Answer

You need to add border-style like this    lt table style  border 1px solid black  gt    or like this    lt table style  border-width 1px border-color black border-style solid   gt

User · Answer

Doing borders on tables with css is a bit more complicated  but not as much  see this jsfiddle as example     x000D   x000D  table   x000D    border-collapse  collapse  x000D    border  1px solid black  x000D    x000D   x000D  table td   x000D    border  1px solid black  x000D    x000D   lt table gt  x000D     lt tr gt  x000D       lt td gt test lt  td gt  x000D       lt td gt test lt  td gt  x000D     lt  tr gt  x000D   lt  table gt  x000D   x000D   x000D

User · Answer

Like this   border  1px solid black    Why it didn t work  because      Always declare the border-style  solid in my example  property before the border-width   property  An element must have borders before you can change the   color

User · Answer

lt table style  border 1px solid black  gt       lt tr gt           lt td gt Derp lt  td gt       lt  tr gt   lt  table gt    This should work  I use the shorthand syntax for borders

User · Answer

lt table style  border  5px solid black  gt    This only adds a border around the table   If you want same border through CSS then add this rule   table tr td   border  5px solid black      and one thing for HTML table to avoid spaces   lt table cellspacing  0  cellpadding  0  gt

User · Answer

The reason it didn t work is that despite setting the border-width and the border-color you didn t specify the border-style    lt table style  border-width 1px border-color black border-style solid   gt    JS Fiddle demo   It s usually better to define the styles in the stylesheet  so that all elements are styled without having to find  and change  every element s style attribute    table       border-color   000      border-width  1px      border-style  solid         or  of course      border  1px solid  000             JS Fiddle demo  Or using shorthand border notation

[html] How do I set <table> border width with CSS?

Examples related to html

Examples related to css