Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • October 16, 2016 at 8:56 pm #699693
    jonathan_lees

    Hi, I have a couple of pages with 5 columns that contain text and images. When viewed on a mobile phone the text overlaps.
    Is there anything I can do to so it displays the columns differently on mobiles? I’m on 3.8

    thanks for the support

    October 16, 2016 at 10:12 pm #699708
    Vinay

    Hey jonathan_lees,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    In mobile version it will be just one column in tablets it will be 3 col as you see in the attached screenshot.

    If you like to modify in mobile and tablet please feel free to adjust the width value in the below code.

    @media only screen and (max-width: 767px) {
.responsive #top .av_one_fifth {
    width: 32%!important;
}}

@media only screen and (max-width: 480px) {
.responsive #top .av_one_fifth {
    width: 100%!important;
}}

    Best regards,
    Vinay

    • This reply was modified 8 years, 2 months ago by Vinay.
    October 16, 2016 at 10:16 pm #699711
    jonathan_lees

    Perfect, thank you!

    October 18, 2016 at 7:02 am #700399
    Rikard

    Hi,

    Glad we could help :-)

    Please let us know if you should need any further help on the topic.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.