You know those pretty and elegant headers on Pinterest where the whole nav is over the banner image but it’s subtly separated by a line that doesn’t quite reach the edges of the site? Well, for today’s CSS trick we’ll be looking into how to create that for Brine’s bottom header!

Today we’ll be addressing a quick CSS trick that you can implement on any Brine template, whenever you want to highlight even further your client’s ACTIVE menu links. Let’s get to it, shall we?

Since the magazine-look for websites seems to be a trend meant to stick around for a while, I thought today I’d share the result of one of my recent experiments where I customized the Stack image block to give it a more “editorial” look.

If you’re a fan of using all the different image block layouts available in Squarespace, I’m pretty sure you’ll be a fan of today’s CSS trick too! This customization is very simple, and it will only take you a couple of minutes to achieve, but it will allow you to give your design a nice touch that no native template can, so why don’t we jump into it?

It seems like there’s not enough creativity in the world to come up with a unique way to set up your nav bar… especially in Squarespace, and particularly if you’re using the Brine template. Which seems silly, since all of the templates from the Brine…

Let’s face it, the footer is the part of our Squarespace design we think about last when it comes to adding customizations. However, that doesn’t mean we can’t show it some love and have it help our site look more custom by giving it a non-default style!