Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • September 10, 2014 at 8:47 pm #316906
    Justin

    Hey guys.
    O posted this before….but it may have been overlooked.
    I have a slider (left column) and a form (right column) on the homepage of this website.
    How can I get the content within the color section container (holding the slider and form) to stretch to the width of the color section container below with the content and the image?

    I am noticing too, that on the mobile device the content isn’t rendering as it should. I know that for the container with the slider and form there’s a custom ID ‘home’ that removes the margin and increases the % width on both columns…that may play a part in it?

    September 10, 2014 at 11:07 pm #316990
    Josue

    Hey Justin!

    Try with this code:

    div#home .container {
    width: 100%;
    margin: 0;
}

    Best regards,
    Josue

    September 11, 2014 at 12:31 am #317039
    Justin
    This reply has been marked as private.
    September 11, 2014 at 12:46 am #317041
    Josue

    Hi!

    That’s happening because of this custom code you have in style.css:

    #home div.av_one_fourth {margin-left:0%!important;width:26.5%!important;background:#c51230;min-height:404px!important;}
#home div.av_three_fourth {margin-left: 0%!important;width:73.5%!important;background:#c51230;}

    You should add some media queries so it changes the percentage values according to the screen size, like:

    @media only screen and (max-width: 989px) {
#home div.av_one_fourth {width:50%!important;}
#home div.av_three_fourth {width:50%!important;}
}

@media only screen and (max-width: 767px) {
#home div.av_one_fourth {width:100%!important;}
#home div.av_three_fourth {width:100%!important;}
}

    Regards,
    Josue

    September 11, 2014 at 1:17 am #317052
    Justin
    This reply has been marked as private.
  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Mobile rendering issues’ is closed to new replies.