Gridstyle
Category: Headers
I'm sharing you a component below for reference the HTML structure with the exact COMPUTED CSS styles inlined into the style tags. Use this to understand exactly how it looks (dimensions, colors, flexbox behavior):
<img src="https://unsection.b-cdn.net/cf-e24e22a9-3cb6-4f9f-1d1e-8b4d9229fb00.jpg" alt="Watershed Navbar Section Design" style="display: inline-block; position: relative; width: 1161.9px; height: 328.388px; max-width: 100%; border: 0px none rgb(255, 255, 255); border-radius: 4px; background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0); color: rgb(255, 255, 255); font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; font-size: 16px; font-weight: 400; line-height: 24px; text-align: start; flex: 0 1 auto; flex-flow: row; opacity: 1; overflow: clip; cursor: crosshair;">
create a canvas to display a navbar component. we want the navbar component to be centered and the space around it to be flexible empty.
reproduce this navbar component
Created by: LandingHero
