Bug 35585

Summary: margin-left:auto; margin-right: [y]px; bug
Product: WebKit Reporter: waldner.charles
Component: CSSAssignee: Nobody <webkit-unassigned>
Status: NEW    
Severity: Major CC: ahmad.saleem792, ap, bfulgham, rniwa, simon.fraser, webkit-bug-importer, zalan
Priority: P2 Keywords: BrowserCompat, InRadar
Version: 528+ (Nightly build)   
Hardware: PC   
OS: Windows 7   
Attachments:
Description Flags
Test Case. none

waldner.charles
Reported 2010-03-02 10:01:43 PST
I am by no means an expert web developer. Apologies in advance. In Safari, a div with margin-left:auto; and margin-right:[y]px; is pushed off the left side of the browser window when re-sized. After [y]px of clipping, the left side of the div tag will snap to the left side of the browser, where it should be. For instance, a page with the following code: <html> <head></head> <body style="margin:0;"> <div style="background-color:#333; width:500px; height:200px; margin-left:auto; margin-right:200px; color:#fff;">Some text to make it more apparent that the div tag is clipping. </div> </body> </html> The html page in firefox, when the browser is at a width of 600px, will show 100px of white space to the right of the tag. In Safari, the page will show 200px of white space and the left side of the div tag will be clipped 100px. Attached is an image of the bug, two windows: Safari and Firefox with the same width viewing the test page.
Attachments
Test Case. (68.42 KB, image/png)
2010-03-02 10:02 PST, waldner.charles 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
waldner.charles
Comment 1 2010-03-02 10:02:37 PST
Created attachment 49811 [details] Test Case.
Ahmad Saleem
Comment 2 2022-08-31 15:05:14 PDT
I changed the test case from Comment 0 and turned it into JSFiddle: Link - https://jsfiddle.net/ps2of8c6/show I am able to reproduce this bug in Safari 15.6.1 and Safari Technology Preview 152 and this is reproducible when you resize window. Once you load, you will see <div> with text and background and when you try to resize window, there will be white space on left side margin, which does not collapse like Firefox Nightly 106 and Chrome Canary 107 and show "div" end to end to visual when viewport is small. I am changing status to "New" and tagging other people for their comments. Thanks!
Radar WebKit Bug Importer
Comment 3 2022-08-31 16:04:46 PDT
<rdar://problem/99408605>
Note You need to log in before you can comment on or make changes to this bug.