Whitespace Issue on iOS / mobile.

Home › Forums › Jevelin Theme › Whitespace Issue on iOS / mobile.

Home › Forums › Jevelin Theme › Whitespace Issue on iOS / mobile.

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    NOT RESOLVED Posts

  • dsk1000
    Participant

    Hello,

     

    I have the installed the latest Jevelin theme at purplecrayondesign.com.

     

    There is an issue on iOS and I believe android browsers in portrait mode.  The slider appears to have extra whitespace above and below.  I have already inserted this slider into a test page to see if it’s css inserted by the slider and it looked fine.  This points to the problem being elsewhere.

     

    You can see the site live and and I’m including a screenshot of the problem.   Thank you,

     

    Doug

    Attachments:
    You must be logged in to view attached files.

    Shufflehound Support
    Moderator

    Hi Doug,

     

    I hope you are well today and thank you for your question.

     

    This can be child theme issue used on your site so to confirm it just temporary use the Jevelin theme on your site. If everything works fine then it’s your site child theme issue.

     

    This can be due to plugin conflict on your site so please try temporary deactivating all plugins except Unyson plugin, Slider Revolution and WpBakery page builder plugins and see whether everything works fine and then enable the plugins one by one to see which plugin is conflicting if any.

     

    Best regards,
    Shufflehound team

    dsk1000
    Participant

    Thank you for the suggestions.

     

    I have tried both of your suggestions, disabling all plugins except those listed and activating the parent theme, and neither one removed the problem.

     

    What else could be the problem?

     

    Doug

    dsk1000
    Participant

    Could this be the error?  It looks like a section is commented out with <!- interrupting the /* comment.

    I don’t know where in your code to find this.

    Attachments:
    You must be logged in to view attached files.

    Shufflehound Support
    Moderator

    Yes, that can be the issue so please try recreating the page and add elements in the new page one by one to see which one is causing the issue.

    dsk1000
    Participant

    I tried recreating the page.  Adding only the slider creates the problem.  You can see this on iOS here: http://purplecrayondesign.com/home2

     

    This points to either the slider or the template.  I also attempted to replace my slider with your Creative-Home slider and the same problem occurs.  This point to your template code.

     

    Please examine the css for the links I have provided and find the problem.

     

    Doug

    Shufflehound Support
    Moderator

    You can resolve it by adding the following CSS code in the Custom CSS code option of your theme on the below path.

     

    Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code

     

    div#header-mobile {
    background: transparent !important;
}

    dsk1000
    Participant

    Thank you for the suggestion but this did not resolve the issue.  It still displays just as in the screenshots I provided.   I placed the code in custom css, cleared my device cache and cleared the page from cache to test.

     

     

    • This reply was modified 4 years, 8 months ago by dsk1000.

    Shufflehound Support
    Moderator

    It displays fine for me now as shown in the attached screenshot.

     

    Could you please try using a different browser?

    dsk1000
    Participant

    I do not see where you attached a screen shot.  Are you using an iOS device to view this or a browser inspector?  The problem does not appear in a browser inspector.  I have confirmed this problem on multiple mobile devices.   Of course, using a different browser on mobile (iOS) is a test method but not a solution.

     

    I have tested the problem using Chrome browser on iOS and it’s actually worse.  On Safari, the whitespace goes away when the device is rotated to landscape orientation.  But in Chrome (iOS), the whitespace is visible in both portrait and landscape orientation.

     

     

    Shufflehound Support
    Moderator

    I could confirm the issue on IOS device.

     

    You can resolve it either by disabling full height option of the row containing the slider or use the below custom CSS code on your site.

     

    #content > .vc_row.vc_row-o-full-height {
    min-height: 0 ! important;
}
  • Author
    Posts
Viewing 11 posts - 1 through 11 (of 11 total)