Return to previous page

How to center add to chart and change text colour

This topic has 4 replies, 2 voices, and was last updated 6 years, 1 months ago ago by Rose Tyler

yohantosadu

Participant

February 23, 2018 at 11:26

text product label is black, i want change to white
http://prntscr.com/iio136
http://prntscr.com/iio1hf
http://prntscr.com/iio1sv

how to center “add to chart”
http://prntscr.com/iio073

custom css which has existed:
————————————————————————————————
.products-grid .product {
width: 33.33% !important;
}
.row-count-3 .product:nth-child(2n+1), .home .row-count-4 .product:nth-child(2n+1){
clear: none !important;
}

.products-loop.products-grid {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
float:left;
}
.products-loop.products-grid .product {
position: relative;
padding-bottom: 35px;
}
.products-loop.products-grid .add_to_cart_button {
position: absolute;
left: 3px;
bottom: 0;
}
.products-loop.products-grid .product .price,
.products-loop.products-grid .product del {
font-size: 14px !important;
}
.products-loop.products-grid .product .add_to_cart_button {
padding: 5px;
}

.single-product .product-information .cart button[type=”submit”], .footer-product a, .footer-product .show-quickly {
color: white!important;
}

#186105 Copied Theme version: WOOPRESSv 3.3 WooCommerce version: Version 4.9.2

3 Answers
Rose Tyler

Support staff

February 23, 2018 at 13:45
Hello,

Please add this custom css code in Theme Options > Custom css:
```
.pagination-cubic li span.page-numbers.current, 
.woocommerce-message .button, .cart-collaterals .checkout-button {
    color: #fff !important;
}
.products-grid .product .add_to_cart_button {
    left: 50%;
    transform: translateX(-50%);
}
```
Regards
#186120 Copied
yohantosadu

Participant

February 23, 2018 at 13:55

themes oprions – custom css – global custom css

but nothing seems to change, the following css code after the css code added above
————————————————–
.products-grid .product {
width: 33.33% !important;
}
.row-count-3 .product:nth-child(2n+1), .home .row-count-4 .product:nth-child(2n+1){
clear: none !important;
}

.products-loop.products-grid {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
float:left;
}
.products-loop.products-grid .product {
position: relative;
padding-bottom: 35px;
}
.products-loop.products-grid .add_to_cart_button {
position: absolute;
left: 3px;
bottom: 0;
}
.products-loop.products-grid .product .price,
.products-loop.products-grid .product del {
font-size: 14px !important;
}
.products-loop.products-grid .product .add_to_cart_button {
padding: 5px;
}

.pagination-cubic li span.page-numbers.current,
.woocommerce-message .button, .cart-collaterals .checkout-button {
color: #fff !important;
}
.products-grid .product .add_to_cart_button {
left: 50%;
transform: translateX(-50%);
}

.single-product .product-information .cart button[type=”submit”], .footer-product a, .footer-product .show-quickly {
color: white!important;
}

#186123 Copied

Rose Tyler

Support staff

February 23, 2018 at 13:59

Hello,

Do you use child theme? Let’s continue our conversation in this topic to prevent misunderstanding https://www.8theme.com/topic/mobile-display-of-product/#post-186122

Regards

#186124 Copied
Viewing 4 results - 1 through 4 (of 4 total)