W3C home > Mailing lists > Public > www-style@w3.org > January 2011

background-clip and background-origin question

From: <tao.yu@nokia.com>
Date: Wed, 19 Jan 2011 20:20:09 +0000
To: <www-style@w3.org>
Message-ID: <2541CC5D225E5340A31E01FE6EC795F5028344E0@008-AM1MPN1-023.mgdnok.nokia.com>
What is the relationship between background-clip (define background painting area) and background-origin (define background positioning area)? How do they impact each other?

I have a case like below:

              border:7px dashed #354658;
              padding: 20px;
              background-image: url("support/green_box.PNG");
              background-repeat: repeat-x;
              background-position: center;
              background-color: silver;
              width:60px;
              height:60px;
              background-clip: border-box;
              background-origin: padding-box;

I assume both background-color (silver) & background-image ('support/green_box.PNG') will appear only in the padding-box area (background-origin: padding-box) and dashed border space should be blank/white. IE8 behaves this way, but some other browsers (Chrome/Safari/Opera v11) still paint both background-color and background-image behind the dashed border. Which browser's behavior is the right one? Looks like IE8 does properly but I am not sure.

Thanks,
-Tao
Received on Wednesday, 19 January 2011 22:31:37 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:36 GMT