Jump to content
Go to solution Solved by tuanphan,

Recommended Posts

22 minutes ago, jhills7090 said:

Hi,

I have an event calendar which is going over the website header when pressed on mobile, I am happy with the look on desktop view but would there be a way to make this more stylish and easier to read for mobile users with CSS?

Website - http://www.tourjet.co.uk

Have you figured it out yet?

image.thumb.png.7840712662ea522e1ca8391a435a9ad1.png

I checked that your event lalendar works correctly now

Press 👍  or mark my comment as solution if you find my sharing useful

🆒 Squarespace pinchzoom lightbox plugin (affiliate link)

👁‍🗨 360 degree photo viewer (affiliate link)

Link to comment
  • Solution
On 8/7/2024 at 5:15 AM, jhills7090 said:

Hi sorry for some context. I want to make sure this text doesn't overlap. Without having to increase the section length.

 

Many Thanks.

Screenshot_20240806_231443_Chrome.jpg

You can use this to Website Tools > Custom CSS to prevent overlap problem

@media screen and (max-width:767px) {
section:has(.yui3-calendar-day-selected) {
    z-index: 99999999 !important;
    position: relative;
}
section:has(.yui3-calendar-day-selected) .fe-block.fe-block-c7e90db14e2a1756a855 {
    opacity: 0 !important;
}
}

image.thumb.png.c29d61b4cc872b1f28ab946e62c11fd7.png

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
Posted (edited)

Just another quick question please, this works for the September 2024 - but if you look at May and June 2025 - it has the original affect - is there a way to fix it for the entire calendar?WhatsAppImage2024-08-10at21_50.17_33e66a3a.thumb.jpg.9442f0c8c79536e45b3ff48bb14318f5.jpg

Edited by jhills7090
Wrong Month - meant September 2024
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.