CSS Layout - Most popular layouts and patterns that can be built with CSS | Product Hunt Embed
.home
~
.explore

Tab

<div style="
    /* Center the content */
    align-items: center;
    display: flex;
    justify-content: center;
">
    <!-- Active tab -->
    <div style="
        /* Border */
        border: 1px solid rgba(0, 0, 0, 0.3);
        /* Hide the bottom border */
        border-bottom-color: transparent;

        /* Border radius */
        border-top-left-radius: 2px;
        border-top-right-radius: 2px;
    ">
        ...
    </div>

    <!-- Inactive tab -->
    <div style="
        /* Has only the bottom border */
        border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    ">
        ...
    </div>
</div>
Subscribe to the newsletter for the latest layouts or patterns. No spam. Ever!