Div CSS nowrap No line-swapping _ experience Exchange
Source: Internet
Author: User
For example, 210px in the ul width of 4 Li, respectively, the width of the 4 Li according to their own content of the length of 80px, 120px, 140px, 80px.
The effect I need is 4 Li to the left automatic arrangement. When the length of the third Li and the first two Li is greater than the UL width, the third Li moves down one line. Shown in the second line. Instead of the UL to support the width, or to support themselves high (content line, height increase)
respectively defines the UL width 210px and Li's width automatically, the discovery result is:
UL has not been propped wide, but Li also did not automatically to the same arrangement. But the content of the line, the Li to support high. Then Sipilailian in the first line.
After careful consideration, I think the problem is on the line of Li's inner content. Then look for the CSS property that prohibits wrapping.
I looked it up on the internet and didn't find it. Asked the group of eternal eyes and the sun, get word-break this attribute. Keep-all, no line change.
The surprise finding solved the problem when added to Li.
To the team to do the page debugging when it was pointed out that there is a problem.
Went over to see that the show did not change. The idea was that it might be a browser version problem.
I used the IE7 and FF for their IE6. Check the DW to find out word-break This property is not supported by IE6:
CSS Properties Word-break not supported Microsoft Internet Explorer 5.0, Microsoft Internet Explorer 5.5, Microsoft Internet Explorer 6.0, N Etscape Navigator 6.0, Netscape Navigator 7.0
Really depressed, this problem has been bothering me before. has not been solved.
That friend has any good method, please advise! Thank you very much.
The problem has been solved. Ridiculous. Manually tapping the code in the DW.
Found a property in the nowrap, this nowrap is not Word-braek? Can it make no change?
I'm just trying to put it on the whole.
White-space:nowrap;
The DW test does not show a dashed line, meaning there is no problem with browser support.
Save F12. The problem has been solved. Oh...
By the way, write the grammar:
Grammar:
White-space:normal | Pre | NoWrap
Take value:
Normal: Default value. The default processing method. Text is automatically processed for line wrapping. If you reach the container boundary, the content will go to the next line
Pre: newline and other whitespace characters will be protected. This value needs ie6+ or! DOCTYPE declared as Standards-compliant mode support. If! DOCTYPE declaration is not specified as Standards-compliant mode, this property is available, but does not work. The result is equivalent to normal. See Pre Object
NoWrap: Forces all text to be displayed in the same line until the text ends or the BR object is encountered. See NoWrap Properties
Description
Sets or retrieves how the space characters within an object are handled.
Whitespace characters, like newline, spaces, TAB, are ignored by default in HTML documents. When this property is set to Normal or nowrap, you can add a space by using a named entity that does not break the line space and use a BR element to add a newline. This property affects the content you use for the Document Object Model (DOM) operation as it does for IE display content.
This property acts on a block object.
This property is read-only for Currentstyle objects. is writable for other objects.
The corresponding script attribute is whitespace.
from:woria.cn
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