Css controls Text wrap and css Text wrap
Automatic line feed is a reasonable line feed for normal characters. Continuous numbers and English characters often increase the container size, which is a headache. The following describes how CSS can be changed.
Row Method
For div, p, and other block-level elements
The normal text line feed (Asian text and non-Asian text) element has the default white-space: normal, automatically wrap after the defined width
Html
The normal text line feed (Asian text and non-Asian text) element has the default white-space: normal, when definedCss
# Wrap {white-space: normal; width: 200px ;}
1. (IE browser) for continuous English characters and Arabic numbers, use word-wrap: break-word; or word-break: break-all; to implement forced Line Disconnection
# Wrap {word-break: break-all; width: 200px ;}
Or
# Wrap {word-wrap: break-word; width: 200px ;}
Effect: line breaks can be implemented.
2. (Firefox) continuous disconnection of English characters and Arabic numerals. None of Firefox versions can solve this problem,
We only need to hide characters that exceed the boundary or add a scroll bar to the container.
# Wrap
{Word-break: break-all; width: 200px; overflow: auto ;}
Abcdefghijklmnabcdefghijklmnabcdefghijklmn1111111Effect: the container is normal and the content is hidden.
For table
1. (IE browser) Use table-layout: fixed; to force the width of the table and hide unnecessary content.
<Table> <table width = "200"> <table> 100 material Network
Finally, the probability of such a phenomenon is very small, but it cannot be ruled out by netizens. IfIf you have any questions, please leave a message below
The following is an example of the effect
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN "" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <Html xmlns =" http://www.w3.org/1999/xhtml "> <Head> <meta http-equiv =" Content-Type "content =" text/html; charset = gb2312 "/> <title> character line feed </title> <style type =" text/css "> table, td, th, div {border: 1px green solid ;} code {font-family: "Courier New", Courier, monospace ;} </style>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
