Geek Answers Handbook

Return CSS attributes without unit

Consider a scenario in which the CSS attribute is missing a unit (px, em, pt,%):

<body> <div style= "width:170; border:1 dotted PaleGreen; background-color:MistyRose"> The quick brown </div> </body>

Questions:

  • Why would he drop the px? Is a pixel always preferred? Is there any rule defined in the W3C working draft or recommendations?
  • Is there a rule that makes reservation of a preferred unit mandatory for UA?
  • Given the above example, the following behavior follows from the following:
    • Internet Explorer: in Quirks mode (IE6,5,4 ..), the width and width of the border are used to return to px. Starting with IE7 (until now, IE10RP), it ignores the entire rule if the unit is missing. Therefore, both rules were ignored.
    • Firefox 13: In the above example, the width drops to px, but the border-width is ignored.
    • Chrome 19, Opera 12, Safari 5.1.2: Returns the width and width of borders to px.

Note. At Microsoft Connect, they said:

The problem you are reporting is by design. IE10 in standard mode ignores width or height without a unit according to CSS standards. The device is optional.

+5
html css cross-browser w3c
source share
2 answers

I do not see the doctype declaration in your HTML, so I can only assume that your test page is displayed in quirks mode.

  • Why would he drop the px? Is a pixel always preferred? Is there any rule defined in the W3C working draft or recommendations?

    It will only return to px in quirks mode (and I believe only for certain properties). And yes, px is the preferred unit of return. This goes back to the obsolete HTML width and height attributes, which accept pixel lengths as units.

  • Is there a rule that makes it mandatory for a UA to return to a preferred unit?

    No, therefore, the inconsistent behavior that you observe. However, in standards mode, the UA must ignore length values ​​without units; the block is not optional, as indicated in the Microsoft Connect that you specify.

    In CSS2.1, all nonzero lengths must have units.

  • Given the above example, which of the following is correct:

    • Internet Explorer: in Quirks mode (IE6,5,4 ..), the width and width of the border are used to return to px. Starting with IE7 (until now, IE10RP), it ignores the entire rule if the unit is missing. Therefore, both rules were ignored.
    • Firefox 13: In the above example, the width drops to px, but the border-width is ignored.
    • Chrome 19, Opera 12, Safari 5.1.2: Returns the width and width of borders to px.

    Again, based on the assumption that your page is in quirks mode, I can only say that although bizarre behavior is mentioned in the specifications, the specific details of such bizarre behavior are not defined in the specifications (as for obvious and not so obvious reasons).

    I assume that Microsoft has changed the behavior of the quirks mode in IE7 + to reflect the behavior of standards for single values, since the quirks mode exists in all browsers (except IE <6) and starts using the same wrong type or lack of doctrine. The behavior in standard mode has not changed, although, as far as I know.

+14
source share
  • "px" is the most common unit, so browsers generally use "common sense" and use "px" because it is the most used device in web designs if no devices are specified.
  • There is no such rule. Browsers use the most used block in the design.
  • The ideal behavior should be to use px and move on without ignoring other styles, but there is no such rule, so when you see different browsers differently, they actually implement their own logic to deal with such errors, no no rules to follow in such scenarios. It depends on the browser what it does.

You should not rely on the browser to fix your error. Always rely on yourself to compete better with CROSS BROWSER

0
source share

More articles:


All Articles