Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #24425

    Hi

    A bug has appeared on my site, it seems that the div .slideshow_align_caption is not lining up properly, it loads fine in other browsers, this problem only appears in chrome. Adjusting slideshow settings and purging my cache doesn’t seem to fix the problem.

    can you shed some light on what’s causing this. The site – https://shimsy.com/

    Thanks!

    #123461

    Hi!

    Try to insert following code into the quick css field:

    .chrome .slideshow_inner_caption {
    padding: 0;
    }

    Best regards,

    Peter

    #123462

    Hi Peter,

    that worked but it made the made the text align right to the edge, I have ajusted it using this code which seems to work when the when the site is full size,

    .chrome .slideshow_inner_caption { padding: 0px 0px 0px 10px; }
    .chrome .slideshow_align_caption { padding: 30px 40px 30px 50px; }

    but on smaller screens the caption seems to be running off the bottom of the slideshow (on chrome only). The height of .slideshow_inner_caption and .slideshow_align_caption don’t seem to adjust when the screen get smaller.

    do you have any ideas?

    thanks!

    #123463

    In this case I’d recommend to use media queries to exclude smaller screens – use it like:

    @media only screen and (min-width: 767px) {
    /* Add your Mobile Styles here */
    .chrome .slideshow_inner_caption { padding: 0px 0px 0px 10px; }
    .chrome .slideshow_align_caption { padding: 30px 40px 30px 50px; }

    }

    and adjust the min-width value if necessary.

    #123464

    Hi, thanks for the pointers I have it looking reasonable on all screens now .

    I have included the code I used below in case it is useful to someone else with the same problem, but it would need to be adjusted depending on the alignment of your text captions in relation to you images. I had to create a lot of size rules because the captions are long and keep running out of the bottom of the slideshow div.

    /*fix slideshow off centre*/
    @media only screen and (max-width: 529px){
    .chrome .responsive #top .caption_supersize .slideshow_caption h1 { font-size: 21px; }
    .chrome .slideshow_align_caption { padding: 5px 10px 5px 10px; }
    }
    @media only screen and (max-width: 767px){
    .chrome .slideshow_inner_caption { padding: 0px 0px 0px 0px; width: 100%; }
    .chrome .slideshow_align_caption { padding: 5px 5px 5px 5px; }
    }
    @media only screen and (max-width: 1100px) and (min-width: 767px) {
    .chrome .slideshow_inner_caption { padding: 0px 0px 0px 0px; width: 100%; }
    .chrome .slideshow_align_caption { padding: 5px 25px 5px 45px; }
    .chrome #top .caption_supersize .slideshow_caption h1 { font-size: 45px; line-height: 0.9em; }
    }
    @media only screen and (min-width: 1100px) {
    .chrome .slideshow_inner_caption { padding: 0px 0px 0px 0px; }
    .chrome .slideshow_align_caption { padding: 20px 35px 0px 55px; }
    .chrome #top .caption_supersize .slideshow_caption h1 { font-size: 55px; line-height: 0.9em; }
    }
    @media only screen and (min-width: 1200px) {
    .chrome .slideshow_inner_caption { padding: 0px 0px 0px 0px; }
    .chrome .slideshow_align_caption { padding: 30px 45px 30px 70px; }
    }

Viewing 5 posts - 1 through 5 (of 5 total)

The topic ‘Slideshow centered text not aligning properly in Chrome’ is closed to new replies.