Transparent Header

header-transparent position-absolute

Add the following CSS in your astroid custom css section (doc).

.astroid-header-section { background: transparent; z-index: 9999; border-bottom: 1px solid rgba(255, 255, 255, 0.26); }

Make sure your header doesn’t have any background color selected in the backend section level or the colors section and change that color to transparent as well.

That’s it. This should do it. You may add the class pb-2 (padding-bottom 2 (range is between 1 – 5)) to create additional padding towards the bottom between the header and the section below.

Last updated

© Astroid Framework 2023.