CODEWITHSUNDEEP
htmllayout
user2839430
user2839430

Reputation: 153

Limit Characters Displayed in HTML

How would I make it so when there are over a certain amount of characters inside of my text written that it will just put ... instead of display it all?

In my footer if I have over a certain amount of characters in my unordered list it will make the display mess up.

Code:

  <li style="width:25%;padding-left:30px;">
    <center>
    <h4>Title Here</h4>
    <ul style="padding:0px;margin:0px;">
      <li>Just a test! Just a test! Just a test! Just a test! Just a test! Just a test! Just a test! Just a test! Just a test! Just a test! Just a test! Just a test! Just a test! Just a test! Just a test! Just a test! Just a test! Just a test! Just a test! Just a test! Just a test!</li>
    </ul>
</center>
  </li>

Upvotes: 0

Views: 4301

Answers (1)

ced-b
ced-b

Reputation: 4065

With CSS you can do something like this:

li {
   width: 150px;
   white-space: nowrap;  
   overflow: hidden;
   text-overflow: ellipsis;
}

This won't let you specify the number of characters, but the width in pixels.

See fiddle for example: http://jsfiddle.net/3gmyX/

Upvotes: 2

Related Questions