Bug 21778
| Summary: | background image is showing twice because of padding-top | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Jon@Chromium <jon> |
| Component: | CSS | Assignee: | Nobody <webkit-unassigned> |
| Status: | RESOLVED INVALID | ||
| Severity: | Normal | ||
| Priority: | P2 | ||
| Version: | 525.x (Safari 3.1) | ||
| Hardware: | PC | ||
| OS: | OS X 10.5 | ||
| URL: | http://football.tomsk.ru/ | ||
Jon@Chromium
Add OK or FAIL after other browsers where you have tested this issue:
Safari 3: OK
Firefox 3: OK
IE 7: OK
What steps will reproduce the problem?
1. Just open http://football.tomsk.ru/
NOTE: Safari 3.1 : Not OK
The issue is caused by the padding-top in the <div> that is currently set to 157px.
Chrome and Safari adds the top padding of 157px and thus, it fills up the <div>'s
remaining space with the same background image.
As with Firefox, there's only one image because they have added the style
-moz-box-sizing: border-box;
to automatically calculate the width and the height of the <div>. border-box means "The width and height properties include the padding and border, but not the margin" as stated in http://developer.mozilla.org/en/CSS/-moz-box-sizing
Opened against Chromium see http://code.google.com/p/chromium/issues/detail?id=1632 for reductions.
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Dave Hyatt
Invalid. They can specify -webkit-box-sizing: border-box if they want it to work in WebKit.