Giters

lowlighter / matcha

🍵 Drop-in semantic styling library in pure CSS. Highly customizable and perfect for simple websites and prototyping web apps!

Home Page:https://matcha.mizu.sh

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

[Bug] Images, iframes, and videos in header will cause spacing issue

tekstrand opened this issue · comments

commented

iframe, img, video are all set the margin: auto by default. If you use an image in header under layout-simple the margin will break the justify-content: space-between rule

Screenshot 2024-06-11 at 11 16 07 AM 
<!DOCTYPE html>
<html lang="en">
    <head>
        <link rel="stylesheet" href="https://matcha.mizu.sh/matcha.css">
    </head>
    <body class="layout-simple">
        <header>
            <img src="images/Austin-Mesh-Logo.svg" alt="Logo for Austin Mesh" title="Austin Mesh" width="500" height="60" />
            <div>
            	Social media links
            </div>
        </header>
    </body>
</html>
commented

Could you add a minimal HTML reproduction snippet if possible please ?

commented

♻️ updated new screenshot with minimal html to replicate