Help in separating button assets

Anonymous
Not applicable
0 0 54
Hello everyone.

So my problem is, when im browsing my cart on mobile, there is an edit button to edit quantity, remove item, update cart...etc

The problem is that the edit button's assets are the same as my homepage's " buy now button ".

Which is too wide for my cart and it pushes everything, i changed the width and it worked, but change also took effect on the buy button on my homepage, with doesn't look good.

So how can i separate the 2 buttons from each other?
0 Likes
Astronaut
761 78 151

Since they are on different pages you will probably be able to target them differently. Can you post  a link to where you're having the problem so we can look at it to give you a solution? 

If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
0 Likes
Anonymous
Not applicable
0 0 54
Can't post links since my store isn't live yet.

One is on the cart page, the other is on thr homapge.

@Ninthony

I tried the " inspect element " method and it gave me the same button name for both, which is what's causing problem.

Thanks.
0 Likes
Astronaut
761 78 151

You can send me a personal message with the password if you'd like if you don't want to post it on here. It may have the same button name, but it's probably inside different containers on each page, so you can target it specifically if the button is in a different one. For example:

 

<style>
.cart-page .btn {
background-color: red;
}
.index-page .btn {
background-color: green;
}
</style>

<div class="cart-page">
//background-color will be red
<button class="btn">Button</button>
</div>

<div class="index-page">
//background-color will be green
<button class="btn">Button</button>
</div>
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
0 Likes
Highlighted
Anonymous
Not applicable
0 0 54
Thank you very much for the effort.

I got to work as i wanted.

Turns out, the cart button was under .btn--secondary.

I manually wrote width:80px; and it worked perfectly.

@Ninthony
0 Likes