Skip to content Skip to sidebar Skip to footer

How Make 2 Lines In

I want to show two lines in . And it is showing, next to each other. First Name (on external website) I want to be like be

Solution 1:

You could add a <br/> to force a line break and define some CSS classes for the font-styling:

<style>
.name { font-weight: bold; }
.subtext { font-size: smaller; }
</style>

<td bgcolor="White" >
<span class="name">First Name</span>  <br/>
<span class="subtext">(on external website)</span>
</td>

Update: For completeness, I'm also including what others have suggested: instead of using a <br/> element, control the line-break via CSS. This has the advantage, that you can change the behavior (remove the line-break) by simply editing the CSS:

<style>
.name { font-weight: bold; display:block; }
.subtext { font-size: smaller; }
</style>

<td bgcolor="White" >
<span class="name">First Name</span>
<span class="subtext">(on external website)</span>
</td>

Instead of using span elements, you could also use divs, which have the line-break by default (but it can be disabled by setting display:inline in the CSS).


Solution 2:

<td bgcolor="White" >
    <span style="font-weight:bold;">First Name</span>  <br/>
    <span style="font-size:6px;">(on external website)</span>
</td>

like that I suppose


Solution 3:

As you want to style the lines differently, you need to put them in separate elements anyway, so if you use block elements they will end up as separate lines:

<td style="background: white;" >
  <div style="font-weight: bold;">First Name</div>
  <div style="font-size: 70%;">(on external website)</div>                                 
</td>

Solution 4:

Use <span></span> with the block attribute or <p></p>


Solution 5:

<td bgcolor="White" >
    <strong>First Name</strong><br />
   <small>(on external website)</small>
  </td>

Post a Comment for "How Make 2 Lines In "