[Support request] Size of widget on mobile

[William]

Hi Tom!

When viewing on mobil the widgets appear to big. Is there any way to down size them only on mobil?

[Leo]

Hi William,

Can you link me to the page?

I should be able to help with some CSS.

Thanks!

[William]

http://www.tronderskkompetanse.no/
So I want the sidebars widgets to scale down when watched on a mobile 🙂

[Leo]

Hmm not really a good way to scaled it down but maybe you can increase the padding on mobile?

@media (max-width: 768px) {
    .widget-area .widget {
        padding: 40px 40px 40px 40px;
    }
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

The current padding is 27px 39px 24px 37px. The notation is top, right, bottom, left.

[William]

Thanks :)!

I am also trying to have one image show on mobile while on pc screen it does not show, but another will!

can you help me?

HTML

<div class="row">
    <img src="http://www.tronderskkompetanse.no/wp-content/uploads/2015/02/19398755_1218590634952938_1355660979_n-e1498667256658.jpg" class="img-responsive careerpage">
    <img src="http://www.tronderskkompetanse.no/wp-content/uploads/2015/02/banner.jpg" class="img-responsive careerpage mobile"> 
    ...       
</div>

@media only screen and (max-device-width: 480px) {
.img-responsive {
display: none;
}
.img-responsive.mobile {
display: block;
}
}

[Leo]

Trying using GP’s built in classes: hide-on-mobile hide-on-tablet hide-on-desktop

[Author]

Posts