Jump to content

Stack Words in Navigation Bar - 7.1

Recommended Posts

  • Replies 5
  • Views 652
  • Created
  • Last Reply

Top Posters In This Topic

14 hours ago, SHendler said:

Site URL: https://StephenHendler.com

Hi there - how can I stack the words 'Background Check' in my navigation bar?

In the Navigation Title, I tried adding BACKGROUND <span> CHECK </span> but it did not work.

StephenHendler.com

Any help?  CC: @tuanphan

If you use a Business Plan or higher, you can add <span> then we will give a JavaScript code to make span work.

If you use a Personal Plan, add this to Design > Custom CSS

div.header-nav-item [href="/about"]:after {
    content: "CHECK";
    display: block;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
On 3/22/2022 at 9:29 PM, SHendler said:

Thanks @tuanphan that worked, but 2 more issues came up:

-It's currently right justified. How can I center 'Check' under 'Background'

-On the actual page (https://stephenhendler.com/about) it doesn't show up stacked, is shows as one line still. How can I adjust this?

#1. Use this new code

div.header-nav-item [href="/about"]:after {
    content: "CHECK";
    display: block;
    text-align: center;
}
div.header-menu-nav-item [href="/about"]:after {
    content: "CHECK";
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • 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.