CSS force wrap instance

Force line feed in CSS settings:

Word-break: break-all is forcibly disconnected to achieve conversion
Normal. Line breaks are allowed according to the text rules of the Asian and non-Asian languages.
Break-all: this behavior is the same as that of the Asian language normal. It also allows non-Asian text lines to be broken in any word. This value is applicable to Asian texts that contain non-Asian texts.
Keep-all: same as normal in all non-Asian languages. Chinese, Korean, and Japanese cannot be disconnected. This solution is suitable for non-Asian texts that contain a small number of Asian texts.
Set or retrieve the line feed behavior of text in an object. Especially when there are multiple languages. Use break-all for Chinese characters.

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 code is as follows:	Copy code
<Div id = "wrap"> normal text wrap (Asian text and non-Asian text) elements have the default white-space: normal, when defined </div> Css # 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

The code is as follows:	Copy code
# Wrap {word-break: break-all; width: 200px ;} Or # Wrap {word-wrap: break-word; width: 200px ;} <Div id = "wrap"> abcdefghijklmnabcdefghijklmnabcdefghijklmn1111111 </div>

Effect: line breaks can be implemented.

2. (Firefox) continuous disconnection of English characters and Arabic numbers. All Firefox versions do not solve this problem. We only need to hide the characters that exceed the boundary or add a scroll bar to the container.

The code is as follows:	Copy code
# Wrap {word-break: break-all; width: 200px; overflow: auto ;} <Div id = "wrap"> abcdefghijklmnabcdefghijklmnabcdefghijklmn1111111 </div>

Instance

The code is as follows:	Copy code
<Style type = "text/css"> . AutoNewline {  Word-break: break-all;/* required */ }  </Style> <Table> <Tr> <Td class = "AutoNewline"> automatic line feed </td> </Tr> </Table>