Please note, this is a STATIC archive of website developer.mozilla.org from 03 Nov 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.

Revision 200506 of background-position Keyword Order

  • Revision slug: background-position_Keyword_Order
  • Revision title: background-position Keyword Order
  • Revision id: 200506
  • Created:
  • Creator: Mathieu Deaudelin
  • Is current revision? No
  • Comment /* The Problem */
Tags: 

Revision Content


Summary: Learn about a work around for bug 124192 in Netscape 6.2/Mozilla 0.9.8 where keyword order in the CSS background-position property can affect Netscape 6.2/Mozilla. In early February 2002 an obscure bug was uncovered in Mozilla 0.9.8. This bug can affect authors who use the background-position keywords right or left in conjunction with the keyword center. The bug is triggered by the appearance of these keywords in either the shorthand property background or the property background-position. While a patch exists for this bug and it is expected to be corrected in Mozilla 0.9.9, the bug still affects Netscape 6.0 through Netscape 6.2.1.

The Problem

Due to a parsing error in the affected browsers, any background-related declaration that contains the keyword combinations center left or center right will be ignored. The combinations left center and right center do not trigger this bug; neither do any other combinations of keywords that involve center, such as center top. See {{template.Bug(124193)}}, which contains a test case that illustrates the problem.

In the case of background, the entire declaration will be ignored if this bug is triggered. For example:

background: white url(smile.png) center left repeat-y scroll;}

The browser will treat the entire declaration as if it did not exist, thus preventing the setting of the other background values such as color, image, and so on. Reversing the order of the position keywords will avoid the bug.

Recommendations

  • When using either the property background or the property background-position, the background position keyword center should come second if the other value is right or left.
  • In general, it is a good idea to always put the horizontal keyword (e.g., left) before the vertical keyword (e.g., top). Acquiring this habit will enable authors to avoid this bug in all cases, and to avoid authoring errors when using length and percentage values to set the background position. When using such values, the horizontal value must always come first.

Related Links

Original Document Information

  • Author(s): Eric A. Meyer, Netscape Communications
  • Last Updated Date: Published 04 Mar 2002
  • Copyright Information: Copyright © 2001-2003 Netscape. All rights reserved.
  • Note: This reprinted article was originally part of the DevEdge site.

Revision Source

<p>
</p><p><br>
<span class="comment">Summary: Learn about a work around for bug 124192 in Netscape 6.2/Mozilla 0.9.8 where keyword order in the CSS background-position property can affect Netscape 6.2/Mozilla.</span>
In early February 2002 an obscure bug was uncovered in Mozilla 0.9.8. This bug can affect authors who use the <code>background-position</code> keywords <code>right</code> or <code>left</code> in conjunction with the keyword <code>center</code>. The bug is triggered by the appearance of these keywords in either the shorthand property <code>background</code> or the property <code>background-position</code>. While a patch exists for this bug and it is expected to be corrected in Mozilla 0.9.9, the bug still affects Netscape 6.0 through Netscape 6.2.1.
</p>
<h3 name="The_Problem"> The Problem </h3>
<p>Due to a parsing error in the affected browsers, any background-related declaration that contains the keyword combinations <code>center left</code> or <code>center right</code> will be ignored. The combinations <code>left center</code> and <code>right center</code> do not trigger this bug; neither do any other combinations of keywords that involve <code>center</code>, such as <code>center top</code>. See {{template.Bug(124193)}}, which contains a <a class="external" href="https://bugzilla.mozilla.org/showattachment.cgi?attach_id=68371">test case</a> that illustrates the problem.
</p><p>In the case of <code>background</code>, the <i>entire declaration</i> will be ignored if this bug is triggered. For example:
</p>
<pre>background: white url(smile.png) center left repeat-y scroll;}</pre>
<p>The browser will treat the entire declaration as if it did not exist, thus preventing the setting of the other background values such as color, image, and so on. Reversing the order of the position keywords will avoid the bug.
</p>
<h3 name="Recommendations"> Recommendations </h3>
<ul><li> When using either the property <code>background</code> or the property <code>background-position</code>, the background position keyword <code>center</code> should come second if the other value is <code>right</code> or <code>left</code>.
</li><li> In general, it is a good idea to always put the horizontal keyword (e.g., <code>left</code>) before the vertical keyword (e.g., <code>top</code>). Acquiring this habit will enable authors to avoid this bug in all cases, and to avoid authoring errors when using length and percentage values to set the background position. When using such values, the horizontal value must always come first.
</li></ul>
<h3 name="Related_Links"> Related Links </h3>
<ul><li> <a class="external" href="https://bugzilla.mozilla.org/show_bug.cgi?id=124193">Bugzilla entry #124193</a>
</li></ul>
<div class="originaldocinfo">
<h3 name="Original_Document_Information"> Original Document Information </h3>
<ul><li> Author(s): Eric A. Meyer, Netscape Communications
</li><li> Last Updated Date: Published 04 Mar 2002
</li><li> Copyright Information: Copyright © 2001-2003 Netscape. All rights reserved.
</li><li> Note: This reprinted article was originally part of the DevEdge site.
</li></ul>
</div>
Revert to this revision