Hi themassapothecary,
You can use custom CSS to adapt it, something like this:
@media screen and (max-width:480px) {
.pwb-all-brands .pwb-brands-cols-outer .pwb-brands-col3 {
width: 50%!important;
float: left!important;
}
}
The previous code sets 2 columns for the smartphone view, then you should check your code because there is an .elementor-widget-container element that haves a padding-left that causes the brands are not centered.
🙂
Thank you that helped a lot. What CSS would I have to add to make it so each brand title with the amount of products is a single line with 3 dots if its longer than one line? Now it looks good they just aren’t all aligned because some of the brand names with number of products is longer than one line and some aren’t.
Hi themassapothecary,
Try the css below:
.pwb-all-brands .pwb-brands-col3 > p {
width: 100%;
white-space: nowrap;
text-overflow: ellipsis;
}
🙂
What kind of css do i use to make a border around each brand title & logo?
Hi themassapothecary,
You can apply the styles you want, something like this for the border:
.pwb-all-brands .pwb-brands-col3{
border: 1px solid #ddd;
}
Thanks for using PWB.
Thank you. How do i make it so that each picture/logo and title is centered in its column?
right now there is alot of extra space to the right of every logo on every column and it looks weird
