Bug 262111 - Broken 'button' layout with display:table on www.weekly10.com
Summary: Broken 'button' layout with display:table on www.weekly10.com
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: Safari Technology Preview
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords: BrowserCompat, InRadar, NeedsReduction
Depends on:
Blocks:
 
Reported: 2023-09-26 05:24 PDT by Ahmad Saleem
Modified: 2023-09-27 16:07 PDT (History)
5 users (show)

See Also:

Attachments
Screenshot (26.34 KB, image/png)
2023-09-26 12:53 PDT, Simon Fraser (smfr) 		no flags Details
rendering in Safari, firefox, chrome (264.51 KB, image/png)
2023-09-27 01:18 PDT, Karl Dubost 		no flags Details
rendering in Safari, firefox, chrome (1.01 MB, image/png)
2023-09-27 01:25 PDT, Karl Dubost 		no flags Details
reduced-example (823 bytes, text/html)
2023-09-27 02:01 PDT, Karl Dubost 		no flags Details
View All 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 Ahmad Saleem 2023-09-26 05:24:52 PDT 
Hi Team,

While stumbling across this website, I noticed that website has broken 'Book a demo' button layout in Safari (Safari 16.6, Safari Technology Preview 179 and WebKit ToT) while Chrome Canary 119 and Firefox Nightly works fine.

Website: https://www.weekly10.com

It is not reduced test case but just thought to raise it.

Just wanted to raise so we can fix it.

Thanks!
Comment 1 Simon Fraser (smfr) 2023-09-26 12:53:02 PDT 
Created attachment 467879 [details]
Screenshot
Comment 2 Karl Dubost 2023-09-27 01:18:02 PDT 
Created attachment 467888 [details]
rendering in Safari, firefox, chrome

narrow window doesn't show the issue.
Comment 3 Karl Dubost 2023-09-27 01:25:50 PDT 
Created attachment 467889 [details]
rendering in Safari, firefox, chrome

The container is getting a flex for a wider viewport.
Comment 4 Karl Dubost 2023-09-27 02:01:57 PDT 
Created attachment 467891 [details]
reduced-example

ok. this is a bit strange.

Simply disabling the border on .secondary-cta
fixes the issue.
Comment 5 Karl Dubost 2023-09-27 02:07:53 PDT 
Another interesting detail, 
I have a different behavior if 

1. I load the file and disable the border. (issue is exhibited)
2. I remove the border and load the file. (layout of two boxes work well)
Comment 6 Radar WebKit Bug Importer 2023-09-27 02:08:31 PDT 
<rdar://problem/116110440>