Jump to content

Why is all my type so small in my cart?

Go to solution Solved by creedon,

Recommended Posts

I cannot for the life of me figure out what's wrong. None of my type is this small anywhere else on the site, and I've combed through my current code injections and nothing seems like it should be interfering with the cart. Also would appreciate help in moving the quantity and price numbers down. Thanks!

Screen Shot 2023-09-05 at 5.39.37 PM.png

Link to comment
  • Solution

SS apparently didn't design the cart with larger fonts in mind and it is all out of whack.

Add the following to Website > Website Tools > Custom CSS.

.cart-row-price,
.cart-row-qty-input,
.cart-subtotal-label,
.cart-subtotal-price,
.cart-row-title

  {
  
    font-size : unset;
    line-height : unset;
    
    }

Let us know how it goes.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment
1 hour ago, creedon said:

SS apparently didn't design the cart with larger fonts in mind and it is all out of whack.

Add the following to Website > Website Tools > Custom CSS.

.cart-row-price,
.cart-row-qty-input,
.cart-subtotal-label,
.cart-subtotal-price,
.cart-row-title

  {
  
    font-size : unset;
    line-height : unset;
    
    }

Let us know how it goes.

This did it— but you have to add "!important" before every alteration's semicolon (i.e. font-size: 40px !important;)

 

Things look muuuuuuch better. If it isn't too much of a bother, would you know a solution to move the subtotal, final cost, and checkout button all to be centered? Thanks so much for your help! 

 

image.thumb.png.13563a74f34d3887f9683e52f7759f7c.png

Edited by cloudhymns
Change ";" to semicolon — for clarity.
Link to comment

Oh, gosh. I didn't notice that there is a separate (though similar) issue when there are no items in the cart. Do you know what the solution here would be as well? I just don't know how to target that "you have nothing in your cart" text, or the "continue shopping" button in this context. Thank you!

 

image.thumb.png.5bd67fcf9bc7ce9b27b804f0cfab35b3.png

Link to comment
Quote

I didn't notice that there is a separate (though similar) issue when there are no items in the cart.

 

#cart .empty-message {

  font-size : unset;
  line-height : unset;
  
  }

 

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment
Quote

would you know a solution to move the subtotal, final cost, and checkout button all to be centered?

This ruleset may be a bit more fragile as SS doesn't provide a semantic class to target these elements for alignment.

.cart-container ~ div:last-child {

  text-align : center;
  
  }

 

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

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.