RESOLVED FIXED278381
Margin of last element bleeding out of the parent with min-height 
https://bugs.webkit.org/show_bug.cgi?id=278381
Summary Margin of last element bleeding out of the parent with min-height
sadiqkhoja
Reported 2024-08-20 08:30:37 PDT
Created attachment 472246 [details] See the gap between .main-content and .footer The bottom margin of the last element is bleeding out of the parents min-height, causing an unexpected gap between parent element and its next sibling. The gap goes away if parent has bottom border or the last element doesn't have bottom margin. Consider the following HTML, div.last-element has bottom margin and div.main-content has minimum height based on the viewport's height, this causes gap between div.main-content and div.footer: ``` <!doctype html> <html lang="en"> <head> <title>Safari bug</title> <style> .main-content { min-height: calc(100vh - 3rem); background-color: blue; /* uncomment the following line to remove the gap */ /* border-bottom: 1px solid; */ } .last-element { margin-bottom: 2rem; } .footer { background-color: red; } </style> </head> <body> <div class="main-content"> <p> Main content </p> <div class="last-element">last element</div> </div> <div class="footer"> powered by MyApp </div> </body> </html> ``` Attached is the rendered page with the gap. The issue is probably related to this bug: https://bugs.webkit.org/show_bug.cgi?id=239946
Attachments
See the gap between .main-content and .footer (635.58 KB, image/png)
2024-08-20 08:30 PDT, sadiqkhoja 		no flags
Details
[fast-cq]Patch (14.92 KB, patch)
2026-04-14 13:44 PDT, alan 		no flags
DetailsFormatted DiffDiff
View All Add attachment proposed patch, testcase, etc.
Radar WebKit Bug Importer
Comment 1 2024-08-20 11:05:25 PDT
<rdar://problem/134356544>
alan
Comment 2 2026-04-14 13:44:27 PDT
Created attachment 479074 [details] [fast-cq]Patch
EWS
Comment 3 2026-04-15 04:58:51 PDT
Committed 311274@main (c6e90cd95073): <https://commits.webkit.org/311274@main> All reviewed patches have been landed. Closing bug and clearing flags on attachment 479074 [details].
Note You need to log in before you can comment on or make changes to this bug.