ladybird icon indicating copy to clipboard operation
ladybird copied to clipboard

Empty label element's height is not 0

Open gjf7 opened this issue 1 year ago • 2 comments

Summary

Empty label element has height, and could affect by line-height.

Operating system

macOS

Steps to reproduce

  1. open the html beblow
  2. then you can see the empty label has height, despite inspector states that it has 0 height.

Expected behavior

Empty label element height should be 0. Chrome didn't have this issue.

Actual behavior

Empty label has a default height of 16px, which could be affected by the line-height.

URL for a reduced test case

N/A

HTML/SVG/etc. source for a reduced test case

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>test</title>
    </head>
    <body>
        <nav class="site-nav">
            <label for="nav-trigger"></label>
            <div class="trigger">
                <a class="page-link" href="/about/">About</a>
            </div>
        </nav>
    </body>
    <style>
        .site-nav {
            line-height: 54px;
        }
    </style>
</html>

Log output and (if possible) backtrace

N/A

Screenshots or screen recordings

Ladybird: image

Chrome: image

Build flags or config settings

No response

Contribute a patch?

  • [X] I’ll contribute a patch for this myself.

gjf7 avatar Dec 10 '24 07:12 gjf7

Looks like this bug related to: https://github.com/LadybirdBrowser/ladybird/blob/4559af6ef553f6a96bd310060ae07c1ac7cbb53b/Libraries/LibWeb/CSS/Default.css#L23-L26

gjf7 avatar Dec 10 '24 09:12 gjf7