Elemental theme fix top navbar

Hello! I have customized the Elemental theme and I am happy with things. The only thing I have a question about is how to make the navbar sticky. I have tried a few things and one worked, but then I lost the CMS tool bar when trying to edit the site.

Any help would be greatly appreciated!

Thank you!

Hi @joaquinvaldez -

In general, to avoid “greedy” styles (i.e. styles that affect the Concrete CMS editing interface And your theme) you can preface your styles with:


That will make sure they only target elements within your theme, and not the Concrete interface.

Hope that helps!

Thank you! So are you saying if I have a custom class called “sticky” and I only want it on the header I would add this to the header tag class=“ccm-page sticky” ?


Not quite - so the .ccm-page class is applied to an outer div around the whole theme, usually.

So in theory you’d do:
.ccm-page .sticky { /* cool styles here */ }

Gotcha! I will try it out.

Thank you @EvanCooper !

1 Like

You bet! Glad that worked :+1: