Home › Forums › CSS › Add to cart button change design › Reply To: Add to cart button change design
Hello dani,
1-For you inspect the structure html do you can use the “Inspect Element”, the chrome tool is better.
Devtools: https://developers.google.com/web/tools/chrome-devtools/inspect-styles/
2-you don’t need to use all my css code, just use what you need, I created the html just for example.
3-Don’t modify the .fa-shopping-bag or .fa-shopping-card class, because do you use this icon in other parts of website, put a class on element container of button then modify just this class. If you see my css code, do you go see some classes that I created, but do you could do of other ways.
This part of code I created the “container-card-button” and “icon-card” class, the same I applied a specific css.
CSS:
container-card-button {
flex: 1;
display: flex;
align-items: center;
background: #0090e3;
color: #fff;
}
.container-card-button .icon-card {
font-size: 22px;
padding: 5px 8px;
}
I apply on ‘.btn-default’ class the porperty:
.btn-default {
flex: 1;
}
I commented a property in ‘.product-thumb’ class, but do you can set this property to 0;
.product-thumb {
padding-bottom: 0;
}
Thats is it.