Jump to content

Title product section - I want my title to stick on one line, so it will not jump to the next line if your device has a smaller screen

Recommended Posts

  • Replies 10
  • Created
  • Last Reply

Top Posters In This Topic

17 hours ago, denisecapriole said:

https://www.capriolecafe.nl/koffie-barista-workshops-den-haag-1 

If we make the screen smaller, the images are not on the same level anymore. Because the text will be on two lines. Hope you understand what I'm trying to say 🙂

Hi. The url doesn't exist. Can you check it again?

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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
16 hours ago, denisecapriole said:

Thank you for your help. I already got a solution, i guess. So i am trying to fix it. 

Can you help me with something else? On our homepage, the buttons are overlapping each other when you use another device (smaller screen). I am talking about the homepage:

https://www.capriolecafe.nl/ 

Add to Design > Custom CSS

/* Buttons overlap */
@media screen and (max-width:991px) and (min-width:768px) {
div#block-1d9f1acdf10fa357252a+.row .span-2 {
    width: 30%;
}
}

 

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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
19 hours ago, denisecapriole said:

Thank you for your quick response. Unfortunately, it doesn't work. Do you have another suggestion?

I see the code worked, for tablet.

Can you list all screen size do you see problem?

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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

That is good to hear that it worked on a tablet, thank you for that.

When I open the webpage on my macbook 13 inch, the buttons are overlapping. As you can see on the photo attached (1). I guess this is also the case on the macbook 11 inch. 

When I crop my screen, to have two webpages open for instance, the buttons are overlapping even more. You can see this on the other screen shot (2). 

 

Print screen 1.png

Print screen 2.png

Link to comment

Don't remove above code. Add this to Design > Custom CSS

/* buttons overlap */
@media screen and (min-width:901px) and (max-width:1300px) {
div#page-section-60af6a072b053d6191b8c519 .span-2 {
    width: 20%;
}
div#page-section-60af6a072b053d6191b8c519 .span-10 {
    width: 70%;
}
}

 

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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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.