Question

I have a <table>, with some text in it:

<table>
  <tr>
    <td>
      <b>Title</b>
      <br />
      Some description text
    </td>
  </tr>
</table>

This works great, except now I want to give the title and the description different text colors. I want to maintain their current spacing though, otherwise I would do this:

<td>
  <p class="title">Title</p>
  <p class="desc">Some description text</p>
</td>

Using a “< p >” element seems to inject a tall new line, instead of the nicer “< br />” (well at least nicer in my opinion). But if I don’t use a “p”, I’m not sure how to apply different styles to either piece of text.

Thanks

Answer 1

Add the following style to your p tags:

css

p {
    padding: 0px;
    margin: 0px;
}

h1 {
    margin-bottom: 0px;
}

html

<td>
    <h1 class="title">Title</h1>
    <p class="desc">Some description text</p>
</td>