Changing Mobile layout - two items per row

yazansammour

Hello, 

I am using muffin builder, i created on row with 4 Items each one is 1/4 width, on desktop all items comes on one line, but on mobile each item comes full width.

how can we control the size of item on mobile, for example I want to show two image items on one row on mobile, is there a way to achieve this?

thanks

mroussev

Same asking from me...I create separate sections for mobile, tablet and desktop, and have two images next to each other. On desktop and tablet they appear next to each other, but on mobile it always switch to one after another. Even if i put max width per element to something small, like 50px, they always appear one after each other on mobile...

Albert

Hi,

we are very sorry but we do not have an option to control item sizes on mobile devices. Items usually goes full width on smaller screens and we do not have any workaround to change this possibility.

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

yazansammour

I think you should think about adding such feature into muffin builder, similar to the responsive options of Visual composer, though it is not very handy in VC.

ljcallander

I'm having this issue too.  So, @muffingroup, what you are saying is that if we use the columns in the muffinbuilder, they won't stack on mobile, and that they will display off the viewport as full width, and you won't fix it?

What am I missing?

I'm having this issued on : http://hollandandrightmyer.com/

ljcallander

nvm... I fixed it!!!!!!!!!!!!!!!!!

I put a class in the section, the section holds the rows and columns that automatically inherit the section class, and then put this code in my responsive CSS (where .h-nhoods is my class). 

@media screen and (max-width: 480px) {

.h-nhoods {

    width: 350px !important;

}

}

Happy coding!

Jason6366

ljcallander which section are you referring to where you added your class ?