Jump to content

How to prevent code blocks from stacking on mobile?

Go to solution Solved by Beyondspace,

Recommended Posts

Hi, I have been having trouble with some code blocks on my site: https://yellow-algae-6km8.squarespace.com/#/osmosis-art-show/

I have created my navigation using three code blocks up top (Name, Home, Contact).They display correctly on desktop but stack on mobile. How do I prevent them from stacking on mobile (how do I get them to stay in one row on mobile like they do on desktop)?

 

Thanks!

IMG_3075.PNG

Edited by bivano
Link to comment
  • Solution
4 hours ago, bivano said:

Hi, I have been having trouble with some code blocks on my site: https://yellow-algae-6km8.squarespace.com/#/osmosis-art-show/

They display correctly on desktop but stack on mobile. I'm using three code blocks to create custom navigation where one block is my name, the next is a home button, and the last is a contact button. Does anyone know how to have these display in one row on mobile? Currently it's only on this one page I've linked up top.

 

Thanks!

IMG_3075.PNG

You can wrap you css code on media query so it will not affect the mobile display.

@media only screen and (min-width: 768px) {
/* style for tablet and desktop, not mobile */
}

 

BeyondSpace - Squarespace Website Developer

🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox)
🗓️ Delivery Date Picker (Squarespace Date picker form field)
💫 Gallery block 7.1 workaround
🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations)
🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates)

If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. 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.