Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • June 23, 2015 at 9:15 am #463187
    kelsangchodor

    Hi there,

    Great theme! Thank you.

    Can you check this website enfold.meditateinbrighton.com (in development).

    The images on the homepage on a mobile are displayed beyond the boundaries of the screen so parts are not displayed. Responsive mode is switched on in the theme. Also, it’s set to responsive under 1140. I don’t understand why – can you help? Interesting enough – in the layslider “preview” also they not shown correctly. However, the images display perfectly on a desktop device. The sliders dimensions are 1583 × 300

    Also, do you know why the social media icons on a mobile device overlap the logo image? It looks quite messy. Any help appreciated,

    Best Wishes & thank you in advance,

    Chris.

    June 23, 2015 at 7:11 pm #463564
    Yigit

    Hi kelsangchodor!

    Please try adjusting “responsive under” and “layers container” values in LayerSlider WP > Slider Settings > Layout and check if that helps – http://i.imgur.com/E2YOJ5x.png

    Best regards,
    Yigit

    June 24, 2015 at 12:32 am #463719
    kelsangchodor

    Thanks Yigit,

    That worked!

    Do you have any idea why the logo and social media icons are clashing together at the top when viewed from a mobile device?

    Best wishes,

    Chris.

    June 24, 2015 at 2:38 pm #464123
    Yigit

    Hey!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    @media only screen and (max-width: 767px) and (min-width: 480px) {
.responsive.html_header_top #header_main .social_bookmarks {
  right: -15px;
  margin-top: 0;
}
a#advanced_menu_toggle {
  top: 22px;
}}

    Regards,
    Yigit

    June 25, 2015 at 8:07 am #464432
    kelsangchodor

    Hi Yigit,

    Thank you so much for your reply. I appreciate your time – it worked!

    I’m still having a bit of problem with the sliders. For example:

    http://enfold.meditateinbrighton.com/about-bodhisattva-kmc/

    The text that hovers over the slides is off the screen on a mobile but it fits perfectly on a desktop. I have set response under 1500 and layer container size 1150. I’ve tried other values but just can’t get it to work.

    Any ideas why this might be?

    Best Wishes,

    Chris.

    June 26, 2015 at 9:38 am #464818
    Ismael

    Hi!

    Please post the login details here so that we can check it. Make sure that you have the latest version of the theme. Latest version is 3.2.1.

    Cheers!
    Ismael

    June 26, 2015 at 10:22 am #464840
    kelsangchodor

    Hi Ismael,

    Thanks for getting back to me. I just want to say from the user point of view the support here is wonderful and it makes such a difference! Keep going guys and great job :)

    I managed to fix the problemve abo. For some reason I had a minus figure for the X position on the text layer.

    Can I ask one more question?

    When images are displayed on a mobile device is it possible to set what size they are displayed at? i.e. 50% of normal size? Or is this all automatic. For example:

    http://enfold.meditateinbrighton.com/meditation-rooms/

    On this page of our website – when it is displayed on a mobile device that is being held in portrait the images in the main body of the text look big and make the text look squashed.Is there a way around this? Or is this just the nature of using a mobile device?

    Thank you for your help,

    Best Wishes,

    Chris.

    June 29, 2015 at 3:36 am #465596
    Rikard

    Hey!

    Please try the following in Quick CSS for the images on that particular page:

    @media only screen and (max-width: 767px) {
.page-id-3801 .av_textblock_section a {
  min-width: 100% !important;
}
}

    Cheers!
    Rikard

    • This reply was modified 9 years, 6 months ago by Rikard.
    June 30, 2015 at 8:18 am #466206
    kelsangchodor

    Hi Rikard,

    I tried this CSS but it doesn’t seem to make any changes at all to the image size on those pages on a mobile. Any ideas why not?

    Best Wishes,

    Chris.

    July 1, 2015 at 8:47 am #466818
    Rikard

    Hey Chris!

    Not sure, could you please provide us with a temporary admin login so that we can take a closer look? You can post the details in the Private Content section of your reply.

    Best regards,
    Rikard

    July 1, 2015 at 1:29 pm #466960
    kelsangchodor

    Hi Rikard,

    Have supplied below.

    Best Wishes & thank you in advance,

    Chris.

    • This reply was modified 9 years, 5 months ago by kelsangchodor.
    July 3, 2015 at 10:35 am #467895
    Andy

    Hi!

    the code Rikard provided to you is working and I would decrease the size to maybe 50% and add some margin, so the text is not too close to the image:

    @media only screen and (max-width: 767px) {
.page-id-3801 .av_textblock_section a {
max-width: 50% !important;
margin-right: 10px !important;
}}

    For the second image use this code:

    @media only screen and (max-width: 767px) {
img.size-full.wp-image-5116.alignright {
max-width: 50%;
}}

    Cheers!
    Andy

    July 3, 2015 at 3:44 pm #468083
    kelsangchodor

    Hi Andy,

    It worked – yipee!!!

    Thanks so much for the code. You guys are GREAT!!!

    Best wishes,

    Chris.

    July 4, 2015 at 8:49 am #468341
    Rikard

    Hi!

    Glad we could help :)

    Best regards,
    Rikard

  • Author
    Posts
Viewing 14 posts - 1 through 14 (of 14 total)
  • The topic ‘Layslider images being cropped on mobile’ is closed to new replies.