Bug 172551 - Pseudo element on body breaks background on document root
Summary: Pseudo element on body breaks background on document root
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: Safari 10
Hardware: Mac OS X 10.11
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2017-05-24 11:46 PDT by Jimmy Thomsen
Modified: 2020-06-05 13:30 PDT (History)
4 users (show)

See Also:


Attachments
Screenshots of different browsers (6.90 MB, application/zip)
2017-05-24 11:46 PDT, Jimmy Thomsen
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Jimmy Thomsen 2017-05-24 11:46:49 PDT
Created attachment 311141 [details]
Screenshots of different browsers

Summary:
Please see JSFiddle that demonstrates the problem: https://jsfiddle.net/e0znq0mf/

A background image applied to the document root (<html>) is not rendered properly if the document root element has margin on the left side while a pseudo element is applied to the body (<body>) element. Removing the pseudo element from the body element fixes the problem - but this construct works in all modern browsers except Safari, and is used by e.g. Sitemagic CMS.

See screenshots and JSFiddle.

Steps to Reproduce:
I have created a demo using JSFiddle.net - https://jsfiddle.net/e0znq0mf/

Expected Results:
Proper rendering of background image on document root element.

Observed Results:
Background image is not rendered to the left side of content.

Version:
Safari Version 10.1 (11603.1.30.0.34)
Comment 1 Jimmy Thomsen 2020-06-05 12:24:15 PDT
Is Safari dead? Why are bug reports not being looked into? I feel kind of stupid spending hours and days debugging compatibility problems with Safari (there are plenty of them) when nothing happens. I just reported another bug (https://bugs.webkit.org/show_bug.cgi?id=212839), but frankly I'd rather spend my time helping Google, Microsoft, and Mozilla improve their browsers, if this is the level of involvement we can expect from Apple.
Comment 2 Radar WebKit Bug Importer 2020-06-05 13:29:59 PDT
<rdar://problem/64042364>