Return to previous page

Hot to make 3 coloum category Product at Home for Mobile view

This topic has 2 replies, 2 voices, and was last updated 6 years, 6 months ago ago by Olga Barlow

yohantosadu

Participant

June 5, 2018 at 13:52

for the product is already running well, I tried to add the product category in home, help me to make it into 3 coloum, like a product list.
http://prntscr.com/jr4g3i(category product) like http://prntscr.com/jr4gf4 (product list)

custom css:

.slide-item .product .product-name, .products-grid .product .product-name {
min-height: 50px;
}

.slide-item .product .add-to-container a, .products-grid .product .add-to-container a {
text-align: center;
}

.slide-item .product .add-to-container, .products-grid .product .add-to-container {
padding-left: 0;
padding-right: 0;
text-align: center;
}

.slide-item .product .product-name, .products-grid .product .product-name {
margin-left: 0;
margin-right: 0;
text-align: center;
}

@media only screen and (max-width: 480px) {
.slide-item .product .add-to-container a, .products-grid .product .add-to-container a {
font-size: 10px;
text-align: center;
}
.slide-item .product .add-to-container, .products-grid .product .add-to-container {
padding-left: 0;
padding-right: 0;
text-align: center;
}
.slide-item .product .product-name, .products-grid .product .product-name {
font-size: 10px;
margin-left: 0;
margin-right: 0;
text-align: center;
}
.home h2.title {
font-size: 1.5rem;
}

.slide-item .product .product-name, .products-grid .product .product-name {
min-height: 58px;
}

.product-loop.products-grid .product:nth-child(2n+1),
.sidebar-position-without .product-loop.products-grid .product:nth-child(2n+1) {
clear: none !important;
}
.sidebar-position-without .product-loop.products-grid .product:nth-child(n) {
width: 33.33%;
}
.product-loop.products-grid .product:nth-child(3n+1),
.sidebar-position-without .product-loop.products-grid .product:nth-child(3n+1) {
clear: both !important;
}

#194319 Copied Theme version: Legenda v 3.8 WooCommerce version: 3.4.1

1 Answer

Olga Barlow

Support staff

June 5, 2018 at 20:04

Hello,

Check the home page now.

Regards

#194351 Copied
Viewing 2 results - 1 through 2 (of 2 total)