Jump to content

Custom CSS to control website look in mobile view Novo Template

Recommended Posts

Site URL: https://www.meredithdipietrodesign.com/

Hello and thank you for your help in advance. I just need help with the look of my website in just a few areas when I preview it in mobile view and I am wondering if anyone has some custom CSS to control the following:

1. I can't seem to control the leading between my headers and subheads on some of my pages when they go to mobile view. I'll adjust them fine in desktop view, but then in mobile the leading will be way too large. Also, in one page, the header becomes "jumbled."

2. On two of my pages I have carousel galleries. All of the carousel options work great for desktop view but not for mobile. The carousel images will either be way too large to view or there will be extensive space between the carousel images and the other images on the page.

3. For some reason I can't get website support for my h4 on an iPhone. All the other fonts are supported, but the h4 font I chose would not show up on my Apple phone and I had to chose a websafe font (Arial).

Pictures are attached below. Thank you again for your help in these matters. Feel free to ask any more questions for clarification. Take care and be safe.

 

Gap Problem Above Carousel 2.png

Gap Problem Above Carousel.png

Leading Problem 1.png

Leading Problem 2.png

Leading Problem 3.png

Link to comment
  • Replies 3
  • Views 465
  • Created
  • Last Reply

Hi, tuanphan and I'm sorry to respond late. These are the links to the two pages that I am having trouble with at this moment. I've solved everything in the meantime except the carousel problem I've discussed above (Q2). Any help would be appreciated- thank you!

https://www.meredithdipietrodesign.com/work-1/eventpackage

https://www.meredithdipietrodesign.com/work-1/dipietrodesigns

Link to comment
On 4/6/2021 at 11:13 AM, meredithdipietrodesign said:

Hi, tuanphan and I'm sorry to respond late. These are the links to the two pages that I am having trouble with at this moment. I've solved everything in the meantime except the carousel problem I've discussed above (Q2). Any help would be appreciated- thank you!

https://www.meredithdipietrodesign.com/work-1/eventpackage

https://www.meredithdipietrodesign.com/work-1/dipietrodesigns

Hi. Add this to Design > Custom CSS > Then save & reload your site

/* mobile slide */
@media screen and (max-width:767px) {
.gallery-slideshow {
    height: 35vh !important;
}
}

 

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

Archived

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.