Bug 219687

Summary:

width: max-content with box-sizing: border-box should leave space for padding (Twitter date hover overflow)

Product:

WebKit

Reporter:

Sam Sneddon [:gsnedders] <gsnedders>

Component:

Layout and Rendering

Assignee:

alan <zalan>

Status:

RESOLVED FIXED

Severity:

Normal

CC:

bfulgham, cdumez, changseok, esprehn+autocc, ews-watchlist, glenn, jfernandez, koivisto, kondapallykalyan, mifenton, mmaxfield, pdr, rego, simon.fraser, svillar, webkit-bug-importer, zalan

Priority:

Keywords:

BrowserCompat, InRadar

Version:

Safari Technology Preview

Hardware:

Unspecified

OS:

Unspecified

URL:

https://twitter.com/gsnedders

See Also:

https://bugs.webkit.org/show_bug.cgi?id=219944

Attachments:

Description	Flags
Firefox mouseover	none
Safari mouseover	none
test case	none
Patch	none
Patch	ews-feeder: commit-queue-
Patch	none

Sam Sneddon [:gsnedders]

Reported 2020-12-09 08:27:31 PST

Created attachment 415759 [details] Firefox mouseover If you mouseover a date on a tweet, in Safari (14.0, STP 116, trunk) it wraps to multiple lines but doesn't in other browsers.

Attachments
Firefox mouseover (5.51 KB, image/png) 2020-12-09 08:27 PST, Sam Sneddon [:gsnedders]	no flags	Details
Safari mouseover (6.64 KB, image/png) 2020-12-09 08:27 PST, Sam Sneddon [:gsnedders]	no flags	Details
test case (199 bytes, text/html) 2020-12-09 11:10 PST, alan	no flags	Details
Patch (40.36 KB, patch) 2020-12-19 08:17 PST, alan	no flags	Details Formatted Diff Diff
Patch (40.52 KB, patch) 2020-12-19 08:37 PST, alan	ews-feeder: commit-queue-	Details Formatted Diff Diff
Patch (41.82 KB, patch) 2020-12-19 12:12 PST, alan	no flags	Details Formatted Diff Diff
Show Obsolete (2) View All Add attachment proposed patch, testcase, etc.

Radar WebKit Bug Importer

Comment 1 2020-12-09 08:27:41 PST

<rdar://problem/72137685>

Sam Sneddon [:gsnedders]

Comment 2 2020-12-09 08:27:55 PST

Created attachment 415760 [details] Safari mouseover

Simon Fraser (smfr)

Comment 3 2020-12-09 09:25:06 PST

Maybe the element just isn't quite wide enough for the text in Safari?

Sam Sneddon [:gsnedders]

Comment 4 2020-12-09 09:52:11 PST

Nah, it's definitely WebKit. :) <div style="box-sizing: border-box; padding: 5px; position: absolute; width: max-content;">Filler text</div> Presumably we're not obeying box-sizing for max-content or something like that?

alan

Comment 5 2020-12-09 11:10:31 PST

Created attachment 415774 [details] test case

alan

Comment 6 2020-12-16 09:14:53 PST

LFC patch landed here: https://trac.webkit.org/changeset/270891

alan

Comment 7 2020-12-19 08:17:16 PST

Created attachment 416570 [details] Patch

alan

Comment 8 2020-12-19 08:37:40 PST

Created attachment 416571 [details] Patch