Different alignment on different devices

Support
#1

Hi there, is it possible to text align left on desktop, but switch it to text align center for mobiles?

Thanks.

#2

Hi there,

Thanks for writing in! Yes that’s possible using custom CSS, you can give your element a class for example align-element that needs aligning and then add the following CSS code in the Theme Options > CSS:

@media screen and (max-width: 979px) {
.align-element {
    text-align: center;
}
}

Hope this helps!

#3

I added the align-element to my column, it works, BUT only for the custom headline.

#4

Hi There,

Thanks for writing in!

Can you please send us your website URL so that we can suggest you better. As you have multiple license, its hard to know which website you are talking about.

Thanks

#5

Sure, sorry:

https://www.logoglo.com/new-home/

#6

Hi logoglo,

Please update the CSS code to be like:

@media screen and (max-width: 979px) {
     .align-element, .align-element p, .align-element h2 {
         text-align: center!important;
     }
}

This should work fine,
Thanks.

1 Like
#7

That worked! thanks, but it seams to be applying it on an ipad landscape, I need it just for mobiles for when the gallery on the right, goes under the headlines.

#8

Hi There,

Please update the breakpoints to 767px

@media screen and (max-width: 767px) {
     .align-element, .align-element p, .align-element h2 {
         text-align: center!important;
     }
}

Have a nice day,
Cheers!

#9

It worked! thanks!