Hello,
Thanks for your patience!
- The
#top-bar must be placed outside the #header DIV as in the Default Templates. Example:
<div id="top-bar">
...
</div>
<div id="header">
...
</div>
- Simply use this CSS Code:
@media (min-width: 992px) {
.header-wrap-clone {
height: 100px;
}
}
The .header-wrap-clone is resized dynamically to match any Custom Header Heights. So you can simply check the exact height of your Header after the Page is loaded and then set the Height using CSS. This will ensure that the .header-wrap-clone does not shift after loading.
This will definitely work fine. Hope this Helps!
Have a Great Day and Stay Safe.
Let us know if we can help you with anything else or if you find any further issues.