Bug 148023

Summary: Wrong font size on custom CSS class which changes background colour on iPhone
Product: WebKit Reporter: Moridin <wojtek>
Component: CSSAssignee: Nobody <webkit-unassigned>
Status: NEW    
Severity: Normal CC: ap, bfulgham, webkit-bug-importer
Priority: P2 Keywords: InRadar
Version: 528+ (Nightly build)   
Hardware: iPhone / iPad   
OS: iOS 8.2   
Attachments:
Description Flags
CSS Bug on Mobile Safari none

Moridin
Reported 2015-08-14 01:08:28 PDT
Created attachment 258996 [details] CSS Bug on Mobile Safari Example page: http://www.makoweabc.pl/2015/08/jak-dzialaja-przyciski-w-gornym-lewym-rogu-okien-w-os-x-10-10-yosemite-i-10-11-el-capitan/ Bug pertains to paragraph below <h4> "Uaktualnienie" and above <h4> "/Uaktualnienie". CSS class is "notatka-grey". Description: I use a CSS class which changes a selected paragraph's background to grey using "notatka-grey" or red using "notatka". These paragraphs appear to be fine in every browser apart from mobile Safari on iPhone. It has persisted since iOS 6 if I recall correctly. Since my site has a responsive design, it uses a different font size on iPhones and other smartphones. Mobile Safari appears not to honour this setting when using this class. All is well under mobile Chrome on Android 4.x-5.x and when previewing the site in "iPhone mode" under desktop Safari's responsive design view (10.8-10.11) and other major browsers like Firefox etc. Other examples: 1. http://www.makoweabc.pl/2015/07/tweetbot-dla-os-x-przeceniony-oraz-moje-przemyslania-na-jego-temat/ 2. http://www.makoweabc.pl/2015/07/jakim-jestes-makiem-wydanie-1-4-juz-dostepne/ 3. http://www.makoweabc.pl/lista-wszystkich-modeli-iphonea-ipoda-touch-i-ipada/ 4. http://www.makoweabc.pl/2014/07/recenzja-macbook-air-11-6-mid-2013-pierwsze-urodziny/ Screenshots: 1. Mobile Chrome on Android: https://www.dropbox.com/s/42x8jliq0zsmog2/CSS%20Bug%20Mobile%20Chrome%20on%20Android.png?dl=0 2. Mobile Safari on iPhone: https://www.dropbox.com/s/urrohpwncerheud/CSS%20Bug%20Mobile%20Safari.png?dl=0 3. Desktop Safari Reponsive design mode: https://www.dropbox.com/s/9vbotpxstut8mwx/CSS%20Bug%20Safari%209%20on%20El%20Cap.png?dl=0
Attachments
CSS Bug on Mobile Safari (256.09 KB, image/png)
2015-08-14 01:08 PDT, Moridin 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Alexey Proskuryakov
Comment 1 2015-08-15 13:16:40 PDT
Thank you for the bug report? Would you be wiling to reduce the problem to a smaller test case than the whole web site?
Moridin
Comment 2 2015-08-16 04:02:00 PDT
What do you suggest?
Radar WebKit Bug Importer
Comment 3 2022-07-14 14:33:58 PDT
<rdar://problem/97035750>
Note You need to log in before you can comment on or make changes to this bug.