CSS Wrap Line

Auto Wrap Word-break:break-all and Word-wrap:break-word

Both Word-break:break-all and Word-wrap:break-word are able to wrap the contents of their containers like Div.

The difference between them is:

1,word-break:break-all For example div width 200px, its content will go to 200px automatically wrap, if the line end has an English word very long (congratulation, etc.), it will truncate the word, into the line end of Conra ( Congratulation the front end part of the next behavior tulation (conguatulation) the back end part.

The 2,word-wrap:break-word example is the same as the above, but the difference is that it congratulation the whole word as a whole, and if the end of the line is not wide enough to display the whole word, it automatically puts the whole word on the next line without truncating the word.

3,word-break;break-all Support version: IE5 above this behavior is the same as the normal for Asian languages. Also allows any word in a non-Asian text line to be disconnected. This value is appropriate for Asian text that contains some non-Asian text. Word-wrap:break-word Support version: IE5.5 The above content will be wrapped within the boundary line. If necessary, the word wrap (word-break) will also occur. Forms are automatically wrapped to avoid distraction. Word-break:normal break-all keep-all parameter: normal: To allow line wrapping within a word according to the Asian and non-Asian text rules Break-all: The behavior is the same as the normal for Asian languages. Also allows any word in a non-Asian text line to be disconnected. This value is appropriate for Asian text keep-all that contains some non-Asian text: the same as for all non-Asian languages. For Chinese, Korean, Japanese, word is not allowed to break. Suitable for non-Asian text syntax with small amounts of Asian text: word-wrap:normal break-word parameter: Normal: Allows content to top open the specified container boundary Break-word: Content wraps within the boundary. If necessary, the word wrap (Word-break) also occurs when you set or retrieve whether a career change is broken when the current row exceeds the bounds of the specified container.

The corresponding script attribute is wordwrap. Please refer to other bibliographies I have written. Syntax: Table-layout:auto fixed parameter: Auto: Default automatic algorithm. The layout will be based on the contents of each cell. The table is not displayed until each cell is read and calculated. The speed is very slow fixed: fixed layout algorithm. In this algorithm, the horizontal layout is based solely on the width of the table, the width of the table border, the spacing of the cells, the width of the columns, and the table Content-Independent Description: Sets or retrieves the layout algorithm for the table. The corresponding script attribute is tablelayout.

Recommendation: Word-break 3C detection will show problems, resulting in Baidu snapshots will also be problematic-this property opera FIREFOX Browser also does not support word-break properties can be used white-space:normal; This way in Firefox and IE can be the correct line, and note that the words between the space can not be used to replace, or not correct line.