Bug 21778 - background image is showing twice because of padding-top
Summary: background image is showing twice because of padding-top
Status: RESOLVED INVALID
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: 525.x (Safari 3.1)
Hardware: PC OS X 10.5
: P2 Normal
Assignee: Nobody
URL: http://football.tomsk.ru/
Keywords:
Depends on:
Blocks:
 
Reported: 2008-10-21 14:47 PDT by Jon@Chromium
Modified: 2008-10-21 14:55 PDT (History)
0 users

See Also:

Attachments
Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
Description Jon@Chromium 2008-10-21 14:47:49 PDT 
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.
Comment 1 Dave Hyatt 2008-10-21 14:55:55 PDT 
Invalid. They can specify -webkit-box-sizing: border-box if they want it to work in WebKit.