Color a table row with style color fff for displaying in an email

Question

We would like to display order details as table in an email    lt table gt       lt thead gt           lt tr gt               lt th gt Header 1 lt  th gt               lt th gt Header 2 lt  th gt               lt th gt Header 3 lt  th gt           lt  tr gt       lt  thead gt       lt tbody gt           lt tr gt               lt td gt blah blah lt  td gt               lt td gt blah blah lt  td gt               lt td gt blah blah lt  td gt           lt  tr gt       lt  tbody gt   lt  table gt                                               We would ideally want the header to have background-color as   5D7B9D  and text-color as   fff   We are using bgcolor   5D7B9D  for changing the background-color and are unable to find an alternative to do the same for changing the text-color  As most of the email providers strip the CSS  we cannot use style attribute at all   The questions are   How to make the header text appear in white  Are there any alternate methods

User · Accepted Answer

you can easily do like this -        lt table gt       lt thead gt           lt tr gt             lt th bgcolor   5D7B9D  gt  lt font color   fff  gt Header 1 lt  font gt  lt  th gt             lt th bgcolor   5D7B9D  gt  lt font color   fff  gt Header 2 lt  font gt  lt  th gt              lt th bgcolor   5D7B9D  gt  lt font color   fff  gt Header 3 lt  font gt  lt  th gt           lt  tr gt       lt  thead gt       lt tbody gt           lt tr gt               lt td gt blah blah lt  td gt               lt td gt blah blah lt  td gt               lt td gt blah blah lt  td gt           lt  tr gt       lt  tbody gt   lt  table gt    Demo - http   jsfiddle net VWdxj 7

User · Answer

Try to use the  lt font gt  tag    lt table gt        lt thead gt            lt tr gt                lt th gt  lt font color   FFF  gt Header 1 lt  font gt  lt  th gt                lt th gt  lt font color   FFF  gt Header 1 lt  font gt  lt  th gt                lt th gt  lt font color   FFF  gt Header 1 lt  font gt  lt  th gt            lt  tr gt        lt  thead gt        lt tbody gt            lt tr gt                lt td gt blah blah lt  td gt                lt td gt blah blah lt  td gt                lt td gt blah blah lt  td gt            lt  tr gt        lt  tbody gt    lt  table gt    But I think this should work  too     lt table gt        lt thead gt            lt tr gt                lt th color   FFF  gt Header 1 lt  th gt                lt th color   FFF  gt Header 1 lt  th gt                lt th color   FFF  gt Header 1 lt  th gt            lt  tr gt        lt  thead gt        lt tbody gt            lt tr gt                lt td gt blah blah lt  td gt                lt td gt blah blah lt  td gt                lt td gt blah blah lt  td gt            lt  tr gt        lt  tbody gt    lt  table gt    EDIT   Crossbrowser solution   use capitals in HEX-color    lt th bgcolor   5D7B9D  color   FFFFFF  gt  lt font color   FFFFFF  gt Header 1 lt  font gt  lt  th gt

User · Answer

Rather than using direct tags  you can edit the css attribute for the  color so that any tables you make will have the same color header text   thead       color   FFFFFF

User · Answer

For email templates  inline CSS is the properly used method to style    lt thead gt       lt tr style  color   fff  background  black   gt           lt th gt Header 1 lt  th gt           lt th gt Header 2 lt  th gt           lt th gt Header 3 lt  th gt       lt  tr gt   lt  thead gt

[html] Color a table row with style="color:#fff" for displaying in an email

Examples related to html

Examples related to css

Examples related to html-table

Examples related to html-email