Jump to content

Overflow- x & y?

Recommended Posts

Posted
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 - PDF Lightbox popup - ...) </>  🗓️ Delivery Date Picker (Date picker form field)
Gallery block 7.1 workaround </> No-code customisations for Squarespace

  • 1 month later...
Posted
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

Posted
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!)

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.