CODEWITHSUNDEEP
htmlwebtags
Hujjat Khan
Hujjat Khan

Reputation: 11

How to limit tag content in html

I am trying to show a limit words inside tag is there any way to do this please help me suppose if I have a title which is 20 word I want to show only 10 of them

for example if the title is this much

New StatCounter report highlights global risk to business and other users from Windows XP

I want to show this much

New StatCounter report highlights....

Upvotes: 0

Views: 355

Answers (2)

jdabrowski
jdabrowski

Reputation: 1975

In HTML5 you can do this by using text-overflow:ellipsis:

.container {
  max-width: 250px; // set maximum width of the container
  white-space: nowrap; // do not let text wrap
  overflow: hidden; // do not let overflow out of container
  text-overflow: ellipsis; // shorten all overflowing text
}

But unfortunately this wont help you with shortening the text to a given count of characters. To do this you will have to use javascript or JQuery.

Source: http://css-tricks.com/snippets/css/truncate-string-with-ellipsis/

Upvotes: 1

Steinbock
Steinbock

Reputation: 868

Put the text into a div and use the substr() function to make it smaller.

   $("div.some-area").text(function(index, currentText) {
    return currentText.substr(0, 175);
});

Upvotes: 0

Related Questions