Developer on Alibaba Coud: Build your first app with APIs, SDKs, and tutorials on the Alibaba Cloud. Read more ＞
Because the smallest unit that the screen can display is 1px, there must be a trade-off with the length of a number like 773*50%=386.5.
Test page, some browser's truncated icon width is also inside
IE: calculated in rounded manner.
Firefox: The computed value ignores the decimal part, but assigns the extra length to the elements inside. If you have only 1px, such as 2*386=772, the remaining 1px will go to one of the elements, prioritizing the first element, like 773px allocated to two 50%: 387px and 386PX, when assigned to four 25%: 194px, 193px, 193px and 193px, but for a few px, such as 773*33.3%=257.409,773*33.33%=257.6409, due to ignore the decimal number is not the same, the principle of distribution is not the same, can not find relevant information, the following is my guess, three elements, According to the way of rounding, the priority of the four homes to the two sides, five priority assigned to the front two, for the allocation of more than three elements, more than part of the free distribution, I can not find the law, but the first will definitely be assigned to.
There are some strange places in ff. Firefix test page. 1024 width is not automatically allocated, perhaps because the outer layer is also a decimal, resulting in 1px did not allocate, and then test Firefox
Opera & Safari2: The fractional part of the percentage is ignored in the calculation, the computed value ignores the decimal portion, and if the element inside is greater than the calculated width, the following elements will not be wrapped.
Netscape & Mozilla: After the calculation ignores decimals, the more part is similar to Firefox, but the more part is than transparent display, and more strange, such as 33.33%*3=99.99% less than 100%, but more than 100%, Strange browser, Fortunately, the use of a few people do not care about the two browsers.
Test not completed, interested friends to help test, a separate test page, a friend who knows the reason to talk about the next
This article is an English version of an article which is originally in the Chinese language on aliyun.com and is provided for information purposes only. This website makes no representation or warranty of any kind, either expressed or implied, as to the accuracy, completeness ownership or
reliability of the article or any translations thereof. If you have any concerns or complaints relating to the article, please send an email, providing a detailed description of the concern or
complaint, to firstname.lastname@example.org. A staff member will contact you within 5 working days. Once verified, infringing content will be removed immediately.
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:
and provide relevant evidence. A staff member will contact you within 5 working days.