Mobile view

Resolved piterkaillada
(@thebea58)

7 years, 6 months ago

Hi there,

First of all, let me thank you for this amazing plugin! 🙂

I’ve realized that, for mobile devices, the responsive feature displays all the photos in a single column, which makes them way too big in my opinion.
If I “Make Layout Not Responsive”, since my number of columns is 6, they are way too small.

Would it be possible to use CSS to modify this settings, so I could display 2 or 3 columns in mobile views?

Thank you so much in advance!

The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)

Web-Dorado Team
(@wdteam)

7 years, 6 months ago
Hi,

Please add the below-written CSS code into Appearance > Customize > Additional CSS for displaying 2 columns in mobile views:
```
@media only screen and (max-width: 320px) {
   .wdi_feed_item {
       width:50% !important
   }
}
```
Thank you!

Have a nice day!
Thread Starter piterkaillada
(@thebea58)

7 years, 6 months ago
Hi,

Thanks for your reply. Your suggestion worked perfectly!

Let me make it a bit more complicated, though 😉

If I want mobile devices to have 2 columns and tablets to have 3…
Considering I want to use 600px and 992px as breakpoints, I´ve tried using this CSS:
```
@media only screen and (max-width: 600px) {
   .wdi_feed_item {
       width:50% !important;
   }
}
@media only screen and (max-width: 992px) {
   .wdi_feed_item {
       width:33% !important;
   }
}
```
… but the latter overrides the former.

Can you, please, give me a hand here?

Thank you so much again!
Plugin Support Suzie
(@suziekh)

7 years, 6 months ago
Hi,

Please, try to use the following code.
```
@media only screen and (max-width: 600px) {
 .wdi_feed_item {
     width:50% !important;
 }
}
@media only screen and (min-width:600px) and (max-width: 992px) {
 .wdi_feed_item {
     width:33% !important;
 }
}
```
Thank you and have a nice day!
Thread Starter piterkaillada
(@thebea58)

7 years, 6 months ago

Thank you!

amberprimrose89
(@amberprimrose89)

7 years, 6 months ago

Hello was wondering if I could get some help
Also?

I would like 2 volume displayed on mobile and the css suggested above for me isn’t working?

It displays one column with one photo after the other.

I would just like 2 columns on mobile view one picture next to each other…

The website I need help with is

http://www.slayskinco.com

Thank you

Plugin Support Suzie
(@suziekh)

7 years, 6 months ago

Hi @amberprimrose89,

Would you pleaselet us know whether you have the Contact Form Maker plugin on your website or not? In the page you have mentioned, it cannot be found.

Thank you!