Jump to content

Line break in Brine Collection Navigation Menu

Recommended Posts

Site URL: http://www.houseofgrey.co.uk


I was wondering if there was a way of adding a line break to the Collection Nav item in Brine (this is the large overlay/rollover navigation on the landing page of Brine). I can isolate different menu items and alter their styling but can't find a successful way of forcing an element to stay on it's own line. For instance on the current live site, if 'Store' Could always be on its own line underneath the rest of the navigation.

I have a few janky workarounds like restricting the resizing of the text and the size of the container to pixels so it's not as responsive. I'll then have to resize the mobile menu since it will be huge... But, ideally I would just be able to force line breaks after certain links! 

Site is live: https://www.houseofgrey.co.uk

Thank you!



Link to comment
  • Replies 2
  • Views 444
  • Created
  • Last Reply

Thanks for your response, sorry I didn't see it until now!

No I haven't solved it, i'm guessing it just happens to break at the right spot at the size of your browser window?

This is how it is at a larger width for me (see screenshot 1). It's not as obvious here, but I'm in the process of adding additional elements that come after the store (basically subsections)  and then the line breaks feel weird. I'm attaching screen shots of that as well (although not the live links as it's under nda) BUT the question is all the same as the current live site as to how to line break after/before a specific link.

Screenshot 2021-03-03 at 17.29.16.png

Screenshot 2021-03-03 at 17.32.22.png

Screenshot 2021-03-03 at 17.32.31.png

Link to comment


This topic is now archived and is closed to further replies.

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.