Jump to content

Shopping Cart margins

Recommended Posts

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

Hi,

 

1. On my shopping cart page, how do I add the margins left and right to match the rest of my site? (Gift Card page is an example below)

2. How do I make the shopping cart text and details fall within the margins in MOBILE view?

 

571406624_ScreenShot2020-10-05at9_17_49pm.thumb.png.76c5c69bbe9ea36fe74f0a09edac607d.png

 

841845160_MatthewPortch.thumb.jpeg.d37f164cf881bbc731a808ddd773ae1d.jpeg

 

 

Code injection on rest of website pages:

<style>
@media (min-width: 768px) {
header, .content-wrapper, .section-background {
   padding-left: 9%;
   padding-right: 9%;
  }}
</style>

 

 

812592932_ScreenShot2020-10-05at9_17_20pm.thumb.png.94b4a3de58f0d4ad668e3d96af014cde.png

Link to comment
  • Replies 6
  • Views 784
  • Created
  • Last Reply

@tuanphan Hi, yes I do need help. The code suggested didn't work. The idea was to give the shopping cart page the same margins (left and right) as the rest of the website. And keep the mobile view within the margins. (You would need to enter an item from the store to view the shopping cart page)

Link to comment

@tuanphan

Hi,

1. This first 2 examples below are how I want the shopping cart page margins to look to match the margins in the rest of my site in desk view.

2. The current shopping cart page in mobile view pushes the AUD outside the margin on the right. Plus the text is bunched together.

 

896534306_ScreenShot2020-10-12at3_55_24pm.thumb.png.ddb9f238399b48ccaca1b1b52076679b.png

778793819_ScreenShot2020-10-12at3_55_42pm.thumb.png.8e50f8163e71a8db7d32ae51840f38b9.png

1060785713_ScreenShot2020-10-12at3_55_56pm.thumb.png.434da197b2a1eaac6f10510ca0ddc5f0.png

 

 

 

 

 

 

1509652129_MatthewPortch.thumb.jpeg.8cdbb69d9d7abba77d8b516663c05af8.jpeg

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.