Content deleted Content added
Rescuing 3 sources and tagging 0 as dead. #IABot (v2.0beta15) |
m consolidate ref |
||
Line 1:
{{Use dmy dates|date=July 2019}}
{{multiple issues|
{{no footnotes|date=September 2017}}
Line 63 ⟶ 64:
In 1996, CSS<ref>{{cite web |url=https://www.w3.org/TR/CSS1/ |title=Cascading Style Sheets, level 1 |last1=Wium Lie |first1=Håkon |author-link1=Håkon Wium Lie |last2=Bos |first2=Bert |author-link2=Bert Bos |date=17 December 1996 |publisher=[[World Wide Web Consortium]] |access-date=26 October 2017}}</ref> introduced margin, border and padding for many more elements. It adopted a definition width in relation to content, border, margin and padding similar to that for a table cell.<ref>{{cite web |url=https://www.w3.org/TR/REC-CSS1-961217 |title=Cascading Style Sheets, level 1 |last1=Wium Lie |first1=Håkon |author-link1=Håkon Wium Lie |last2=Bos |first2=Bert |author-link2=Bert Bos |date=17 December 1996 |publisher=[[World Wide Web Consortium]] |access-date=26 October 2017}}</ref> This has since become known as the ''W3C box model''.
At the time, very few browser vendors implemented the W3C box model to the letter. The two major browsers at the time, [[Netscape Communicator|Netscape 4.0]] and [[Internet Explorer 4|Internet Explorer 4.0]] both defined width and height as the distance from border to border.<ref>{{cite web |url=https://ppk.home.xs4all.nl/css2tests/box.html |title=Box model tweaking |last=Koch |first=Peter-Paul |publisher=[[XS4ALL]] |accessdate=26 October 2017}}</ref> This has been referred to as the ''traditional''<ref name="CSS2 - Box model tweaking">{{cite web |url=https://quirksmode.org/css/user-interface/boxsizing.html |title=CSS - box-sizing |last=Koch |first=Peter-Paul |website=QuirksMode |access-date=26 October 2017}}</ref> or the ''Internet Explorer box model''.<ref name=RJ1>{{cite web |url=http://www.456bereastreet.com/archive/200612/internet_explorer_and_the_css_box_model/ |title=Internet Explorer and the CSS box model |last=Johansson |first=Roger |date=21 December 2006 |website=456 Berea Street |access-date=26 October 2017}}</ref>
[[Internet Explorer]] in "[[quirks mode]]" includes the content, padding and borders within a specified width or height; this results in a narrower or shorter rendering of a box than would result following the standard behavior.<ref>{{Cite web| url=http://msdn2.microsoft.com/en-us/library/bb250395.aspx#cssenhancements_topic3 | title=CSS Enhancements in Internet Explorer 6 | author=Lance Silver |date=March 2001 | publisher=[[Microsoft]] | work=[[Microsoft Developer Network]] | accessdate=2007-06-24}}</ref>
Line 80 ⟶ 81:
Various workarounds have been devised to force Internet Explorer versions 5 and earlier to display Web pages using the W3C box model. These workarounds generally exploit unrelated bugs in Internet Explorer's CSS selector processing in order to hide certain rules from the browser. The best known of these workarounds is the "box model hack" developed by [[Tantek Çelik]], a former Microsoft employee who developed this idea while working on Internet Explorer for the Macintosh. It involves specifying a width declaration for Internet Explorer for Windows, and then overriding it with another width declaration for CSS-compliant browsers. This second declaration is hidden from Internet Explorer for Windows by exploiting other bugs in the way that it parses CSS rules. The implementation of these CSS "hacks" has been further complicated by the public release of Internet Explorer 7, which has had some issues fixed, but not others, causing undesired results in pages using these hacks.<ref name="msdn IE7 blog"/>
Box model hacks have proven unreliable because they rely on bugs in browsers' CSS support that may be fixed in later versions. For this reason, some Web developers have instead recommended either avoiding specifying both width and padding for the same element or using [[conditional comment]] and/or [[CSS hack|CSS filter]]s to work around the box model bug in older versions of Internet Explorer.<ref
==Support for Internet Explorer's box model==
| |||