Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Testimonial slider tablet view


ilonapoutanen

Question

Site URL: https://www.poutacreative.fi/

Hi!

I have a testimonial slider on my front page and it works perfectly on mobile and on desktop. However on smaller screens (smaller laptop, tablet) it adds extra padding to the right side for the whole front page. It also affects to text which is not fully centered anymore. How could I fix that?

Näyttökuva 2020-10-28 kello 13.00.19.png

Link to post
  • Answers 6
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

Thanks for helping me, now it works! 🙂

Posted Images

6 answers to this question

Recommended Posts

  • 0

May you try this snippet in custom css, Settings->Design->Custom Css

section[data-section-id="5f6b8bd78eae7008fe79186e"] .content-wrapper {
  padding: 0 !important;
  padding-top: calc(30vmax / 5);
}

image.thumb.png.14f23c2192e76dfe019c3d4ddc0a0892.png

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement, Advanced Product Delivery Date Time PickerGeolocation Automatic Currency Converter, Sortable Table from GSheet
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to post
  • 0
6 hours ago, ilonapoutanen said:

Unfortunately it didn't work. It gives "syntax error" for this line:  padding-top: calc(30vmax / 5);

Sorry it's the limitation of custom css panel, we may want to turn it into custom code

Settings -> Advanced -> Code Injection -> Header

<style>
	section[data-section-id="5f6b8bd78eae7008fe79186e"] .content-wrapper {
      padding: 0 !important;
      padding-top: calc(30vmax / 5);
    }
</style>

 

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement, Advanced Product Delivery Date Time PickerGeolocation Automatic Currency Converter, Sortable Table from GSheet
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to post
  • 0
<style>
	section[data-section-id="5f6b8bd78eae7008fe79186e"] .content-wrapper {
      	padding: 0 !important;
      	padding-top: calc(30vmax / 5);
    }
	@media only screen and (max-width: 600px) {
		section[data-section-id="5f6b8bd78eae7008fe79186e"] .content-wrapper {
	      	padding: 20px !important;
	    }
	}	
</style>

 

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement, Advanced Product Delivery Date Time PickerGeolocation Automatic Currency Converter, Sortable Table from GSheet
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...