Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • October 6, 2015 at 9:27 pm #514760
    GailSabol

    I am using the Enfold theme for a site. All is working great.
    However, when viewing the site on a mobile phone, I have an issue with the first column box covering up the header image and text in the vertical view of the mobile device, but not when viewed holding the mobile device in horizontal view.
    Can anything be done about this?
    Thank you for your help. The site url is listed in the Private Content area.

    Gail

    October 7, 2015 at 12:46 pm #515123
    Andy

    Hi GailSabol!

    use this code in Quick CSS field to control it for mobile portrait mode:

    @media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) {  
ul.avia-slideshow-inner {
height: 170px !important;
}}

    and adjust as needed.

    Best regards,
    Andy

    October 7, 2015 at 9:38 pm #515447
    GailSabol

    Thanks Andy,
    I’ve add the code you provided to the Quick Css field. I tried adjusting the height and saw no change at all to the mobile site.
    I’m viewing on an Android.
    Am I correct to adjust the height? What does the height adjustment control?
    Thank you.
    Gail

    October 8, 2015 at 9:58 am #515666
    Andy

    Hey!

    use this code instead: 

    @media only screen 
  and (min-width: 414px) 
  and (max-width: 736px) 
  and (orientation: portrait) {  
ul.avia-slideshow-inner {
height: 170px !important;
}}

    and clear browser cache before hard refreshing a few times.
    It should control the height of the slideshow, so that your button get visible again on mobile portrait mode.

    Cheers!
    Andy

    • This reply was modified 9 years, 1 month ago by Andy.
    October 8, 2015 at 3:10 pm #515842
    GailSabol

    Sorry Andy, this new code also does not move the height of the slideshow either.
    Any other ideas or would you like access to the admin?
    Gail

    October 9, 2015 at 6:30 am #516169
    Ismael

    Hi!

    What is the screen resolution of your android device? Please try this instead:

    @media only screen 
  and (min-width: 480px) 
  and (max-width: 768px) 
  and (orientation: portrait) {  
.avia-slideshow-inner, .avia-slideshow-inner * {
    height: 500px !important;
}
}

    Adjust the value if necessary.

    Regards,
    Ismael

    October 13, 2015 at 10:13 pm #518416
    GailSabol

    Thank you Ismael. I have also tried the new code you provided, however, the main fullwidth easy slider image with headings and subheads is still partially covered over in vertical view and not in horizontal view on a mobile device.
    Please see the domain pinnacleacoustics.com on your mobile device in vertical view versus horizontal view. The red subhead box that says “Click Here To Request Your Free Consultation”gets covered over in vertical view but is visible in horizontal view.Please let me know if you have any other ideas how to fix this problem.
    Thank you.
    Gail
    null

    October 14, 2015 at 11:44 am #518586
    Andy

    Hey!

    can you provide us admin access please? so we can have a deeper look into it. Post login details here as private reply.

    Best regards,
    Andy

    October 15, 2015 at 4:11 pm #519384
    GailSabol

    Thank you Andy. I created the admin login… see private content.
    Gail

    October 16, 2015 at 11:41 am #519800
    Andy

    Hi!

    try this code for portrait view:

    @media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (orientation: portrait) { 
ul.avia-slideshow-inner {
height: 240px !important;
}}

    Regards,
    Andy

    October 16, 2015 at 3:58 pm #520076
    GailSabol

    Hi Andy,
    I tried the new code you sent this morning and there is no change at all to the position of items in the vertical view on my mobile device.
    Do you think its possible to resolve the problem?
    As this is a new site that has gone live, this is the last issue with my client.
    He is withholding payment until this is resolved.
    Can you help?
    Thank again so much.
    Gail

    October 19, 2015 at 8:07 am #520755
    Ismael

    Hey!

    We modified the code and it looks OK now: http://pinnacleacoustics.com/

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

    Regards,
    Ismael

    October 20, 2015 at 11:42 pm #522083
    GailSabol

    Ismael,
    Thank you so much. Client is very happy this is resolved and so am I.
    Appreciate all the ongoing efforts by the support team.
    Gail

    October 21, 2015 at 9:41 am #522207
    Rikard

    Hi Gail,

    Glad we could help :-)

    Best regards,
    Rikard

  • Author
    Posts
Viewing 14 posts - 1 through 14 (of 14 total)
  • The topic ‘Vertical versus Horizontal Viewing on Smartphone or iPhone’ is closed to new replies.