CODEWITHSUNDEEP
htmlcss
user2867106
user2867106

Reputation: 1131

limit td width that has span elements

I've the following code:

  <td>
    <span class='label label-success'>text1</span>
    <span class='label label-success'>text2</span>
    <span class='label label-success'>text3</span>
    <span class='label label-success'>text4</span>
    <span class='label label-success'>text5</span>
  </td>

I want to limit the width of the so I can get line breaks between spans when the max width is reached, something like this:

text1 text2 text3
text4 text5

Assuming that text4 exceeded the max width.

Ideas?

Upvotes: 0

Views: 206

Answers (2)

H&#229;vard Brynjulfsen
H&#229;vard Brynjulfsen

Reputation: 854

Add table-layout:fixed to the table tag in your CSS, then add the width of the td that you want, like this:

HTML:

<table>
  <td> 
    <span class='label label-success'>text1</span>
    <span class='label label-success'>text2</span>
    <span class='label label-success'>text3</span>
    <span class='label label-success'>text4</span>
    <span class='label label-success'>text5</span>
  </td>
</table>

CSS: 

table {
   border: 1px solid #000;
   table-layout: fixed;
}

table td {
   width: 100px; /* The width you want */
}

Here's a fiddle: http://jsfiddle.net/2mNux/1/

Upvotes: 3

aorfevre
aorfevre

Reputation: 5064

I assume that a command like that 

<td width="200px"> .... </td>

will do the trick for you

Upvotes: 0

Related Questions