Tagged: 

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • May 22, 2015 at 9:12 am #448249
    outsourcesyd

    Hi,

    I am having trouble with tweaking the mobile responsiveness of the website. I have tried posting code from other threads but can’t seem to fix them.

    1. On tablets the text below my icons in the second and third sections of the home page overlap each other in spots. How do I correct this?

    2. On mobile devices how do I align the text and image in the top white bar so that they sit perfectly centered on top of one another?

    3. How do I replace the Fund My Growth banner with a better suited banner on mobile screen sizes only?

    Many many thanks for your help!

    May 23, 2015 at 2:51 am #448827
    Josue

    Hey!

    1. 

    .av_textblock_section .p1 {
    word-wrap: break-word;
}

    2.

    @media only screen and (max-width: 767px) {
    #color-section-01 .flex_column {
        text-align: center;
    }

    #color-section-01 .flex_column .avia-image-container{
        float: none;
        display: inline-block;
    }
}

    3. Set a class of banner-desktop to the current banner, add an adjacent banner (set banner-mobile to this one) and use this code to hide/show each one respectively:

    #av_section_2 .avia-image-container.banner-mobile {
    display: none;
}

@media only screen and (max-width: 767px) {
    #av_section_2 .avia-image-container.banner-desktop {
        display: none;
    }
    #av_section_2 .avia-image-container.banner-mobile {
        display: block;
    }

}

    Best regards,
    Josue

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