Virtuemart Support :: Topic: modules on mobile stay next to eachother (1/1)

Welcome, Guest

Use this Category for your support questions about Responsive Joomla Virtuemart Template - CoolMart (SKU# FLEX-00014)

TOPIC: modules on mobile stay next to eachother

modules on mobile stay next to eachother 10 years 3 months ago #8026

Ton van der Helm	Hello, on Boiliebait the modules on the homepage stay next to eachother on mobile view. These are the modules with facebook and instagram (innerbottom) and the modules Nieuws and Twitter (innerbottom-b) How can this be done so that the modules go below eachother on mobile view. Thanks!
	The topic has been locked.

modules on mobile stay next to eachother 10 years 3 months ago #8048

Support

Hi,

Try this:

open this CSS file:
/templates/flexible_coolmart/css/responsive.css

and to the bottom, add this CSS rule:

@media screen and (max-width:568px) {
    #innerbottom-b .grid-box, #innerbottom .grid-box {
          width:100% !important;
    }
 
}

The above CSS rule means; If the screen resolution drops below 568px (which is where the module layout starts from) the modules inside the #innerbottom-b and #innerbottom will have 100% width size, therefore they will be listed one below each other, instead of side-by side.

If you understand the idea, you can play around with the CSS rule.

Regards,
Support.

Last Edit: 10 years 3 months ago by Support.

The topic has been locked.