Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • November 23, 2016 at 6:22 pm #716095
    SproutMG

    When I view the site on a phone, the Logo area (and menu button) are covering almost half of the full length slider (avia layout builder media element not revolution slider). The other pages of the site do not have an issue with this (when it’s just the banner), just on the home page where the full length slider is.

    I appreciate your help.

    November 23, 2016 at 6:23 pm #716097
    SproutMG

    sorry, the site is http://www.shieldalarmohio.com

    November 24, 2016 at 6:37 am #716263
    Rikard

    Hi,

    I get a coming soon screen on the page you linked to, please post admin login details in private so that we can have a look at your site.

    Best regards,
    Rikard

    November 24, 2016 at 2:43 pm #716427
    SproutMG

    Below

    November 28, 2016 at 5:10 am #717552
    Ismael

    Hi!

    Thank you for the info. You can increase the height of the slider on mobile view. 

    @media only screen and (max-width: 767px) {
    .avia-slideshow-inner {
        height: 400px !important;
    }

    .av-video-slide .mejs-mediaelement {
        height: 150%;
        margin-top: -13%;
    }
}

    Best regards,
    Ismael

    November 28, 2016 at 11:14 pm #718037
    SproutMG

    I tried adding this code to my css file and it did increase theslizer size, however, it just added black space after the bottem of the slider image and did not correct the alignment/overlapping error created by the menu/logo area.

    December 1, 2016 at 4:40 pm #719325
    Yigit

    Hi,

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

    @media only screen and (max-width: 480px) {
.avia-caption-title {
    margin-bottom: 0;
}
.avia-slideshow-button {
    margin-top: 0!important;
}
.slideshow_align_caption p {
    margin: 0;
}}

    Best regards,
    Yigit

    December 6, 2016 at 9:03 pm #721200
    SproutMG

    I tried that and it only effects the elements within the main content area. It doesn’t effect the logo and menu content area from overlapping the main content area.

    December 7, 2016 at 5:18 pm #721591
    Yigit

    Hi,

    Can you please post a screenshot showing the issue? I am not sure if we are on the same page. You can upload your screenshots on imgur.com or Dropbox public folder and post the links here.

    Best regards,
    Yigit

    December 7, 2016 at 5:25 pm #721596
    SproutMG

    http://sproutmarketinggroup.com/wp-content/uploads/2016/12/IMG_0289.PNG.png

    December 11, 2016 at 5:48 am #722773
    Ismael

    Hi,

    You removed our first css suggestion. We added it back and then adjusted a few values. Please remove browser cache before checking the page. If you want to adjust the values, please go to the Quick CSS field.

    
@media only screen and (max-width: 767px) {
    .avia-slideshow-inner {
        height: 400px !important;
    }

.av_slideshow_full li img {
    border-radius: 0px;
    height: 400px;
    max-width: 200% !important;
    width: 200% !important;
    margin-left: -50%;
}
}

    Best regards,
    Ismael

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