CSS resolves text overflow in TD cell

Source: Internet
Author: User

TD cell display in the text is too long, will always automatically branch, the table is high, or a dense piece, always not good-looking ~

My first practice is to use PHP mb_substr () to intercept fixed-length strings, but, because of the differences between the English and Chinese characters, for example, 10 characters in Chinese character than 10 English characters to be much longer, on the Web page is suddenly long and short, can not be aligned, very unattractive ~

~ Solution ~

The first step:<table> tag plus style:style= "table-layout:fixed;" (Be sure to add, otherwise the TD style defined below does not work)

The second step:<td> style:style= "overflow:hidden;white-space:nowrap;text-overflow:ellipsis;"

~ Successful Solution ~

=================== Supplement ===================

Encounter a situation, using the above method, in IE10, IE9, IE8, Firefox, Opera can hide beyond the text, but in IE7 and IE6 cannot hide, showing a dense line of text (Chinese with punctuation), after searching and trying, Find two solutions: one is to set up a layer of div between TD and text. The second is the width of the TD set without a definite number, but with a percentage.

Reprinted from: http://blog.csdn.net/happyqyt/article/details/6635047

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.