Jump to content

Overflow- x & y?

Recommended Posts

5 minutes ago, Cecelia said:

what is overflow-x and overflow-y?

Get reference with the following links: 

https://www.w3schools.com/cssref/css3_pr_overflow-x.asp

https://www.w3schools.com/cssref/css3_pr_overflow-y.asp

x: for the horizontal  direction

y: for the vertical direction

 

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
  • 1 month later...
On 2/16/2022 at 1:03 PM, bangank36 said:

Get reference with the following links: 

https://www.w3schools.com/cssref/css3_pr_overflow-x.asp

https://www.w3schools.com/cssref/css3_pr_overflow-y.asp

x: for the horizontal  direction

y: for the vertical direction

 

Is it possible to use this to stop a section getting cut off? 

www.hornbeamtraining.co.uk/home

I want to simply reduce the height of some sections across my website but quite often either the banner image or the content gets cut off. 

I tried adding the following code 

section#consultation {min-height:60vh!important;
border-bottom: 12px solid #d1ab13;
 overflow-y: visible!important;
}

but it isn't having the desired effect 

 

1183061284_Screenshot2022-04-08at21_03_52.thumb.png.f493f01392edad5320e85ff087d37cb3.pngI127942558_Screenshot2022-04-08at21_03_38.thumb.png.aa577509df6c866171cd238f89e53537.png

Link to comment
On 4/9/2022 at 3:07 AM, MillyBanks said:

Is it possible to use this to stop a section getting cut off? 

www.hornbeamtraining.co.uk/home

I want to simply reduce the height of some sections across my website but quite often either the banner image or the content gets cut off. 

I tried adding the following code 

section#consultation {min-height:60vh!important;
border-bottom: 12px solid #d1ab13;
 overflow-y: visible!important;
}

but it isn't having the desired effect 

 

1183061284_Screenshot2022-04-08at21_03_52.thumb.png.f493f01392edad5320e85ff087d37cb3.pngI127942558_Screenshot2022-04-08at21_03_38.thumb.png.aa577509df6c866171cd238f89e53537.png

Add to Design > Custom CSS

/* ready to improve section */
section#testimonials>div {
    padding-top: 0px;
    padding-bottom: 0px;
}

 

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.