Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • January 27, 2016 at 12:16 am #572463
    Eleina_Shinn

    http://new.endurehostingaccount.com/

    Have a Fullwidth Easy Slider on Home Page, but wanted more room for the large header and caption, so I used CSS to change the Width as follows:
    .slideshow_caption { width: 65%; }

    But here’s the problem, on certain monitors, and my phone, the bottom of the slide is now cut off – I must have stretched out the content, but the slide is not responding? can you help me

    January 27, 2016 at 2:27 am #572498
    Elliott

    Hi Eleina_Shinn!

    Add this to set it back to 100% width on smaller screens.

    @media screen and (max-width: 767px) {
.slideshow_caption { width: 100% !important; }
}

    Cheers!
    Elliott

    January 27, 2016 at 3:22 pm #572916
    Eleina_Shinn

    Darn, it didn’t work… I love this slider and want to use it so much… any other suggestions?

    January 27, 2016 at 3:33 pm #572937
    Yigit

    Hi!

    Can you please change your code to following one 

    @media only screen and (min-width: 768px) {
.slideshow_caption { width: 65%; }}

    Best regards,
    Yigit

    January 27, 2016 at 3:34 pm #572938
    Eleina_Shinn

    yep, no cigar :(

    January 27, 2016 at 3:45 pm #572952
    Yigit

    Hey!

    Do you mind creating a temporary admin login and posting it here privately?

    Regards,
    Yigit

    January 27, 2016 at 3:58 pm #572972
    Eleina_Shinn

    Of course not, your help is so appreciated!

    Oh, and I tested the site on Screenfly… the slider gets cut off on all kinds of screens.

    It looks like my css code to make the caption area wider/bigger only takes effect on some screen sizes, so my css must be bad, not at the root, so not responsive, because on all kinds of screens (except mine, looks beautiful on mine) – you can see on other screens that the caption area is still a much smaller width (the original 45%), so caption area is longer (more height) than size of slide, if that makes sense, and it’s all cut off, you’ll see.

    and thank you for looking in to this :)

    January 29, 2016 at 10:29 am #574407
    Vinay

    Hi!

    We are working on your ticket please wait while we update the results here soon.

    Since there is not enough room in the small screen the slider text is hidden in small screen you can enable it by deleting

    ” .slideshow_align_caption p { display: none !important; } ”

    in the code below and please feel free to adjust the font size as required for different screen size.

    
/* Custom Slider fonts*/
@media only screen and (max-width: 1300px) {
    .slideshow_align_caption h2  { font-size   : 32px!important;  }
    .slideshow_align_caption p   { font-size   : 18px!important;  }
    .slideshow_caption           {  width      : 75%!important;   }
}

@media only screen and (max-width: 768px) {
    .slideshow_align_caption h2  { font-size   : 24px!important;  }
    .slideshow_align_caption p   { font-size   : 14px!important;  }
    .slideshow_caption           {  width      : 75%!important;   }
}

@media only screen and (max-width: 968px) {
    .slideshow_align_caption h2  { display: none !important;  }
    .slideshow_align_caption p   { display: none !important;  }
    .slideshow_caption           {  width      : 75%!important;   }
}

.av_slideshow_full.avia-slideshow,
.avia-slideshow-inner {
     min-height: 410px!important;
     min-width: 100%!important;     
     overflow: hidden;
}

.av_slideshow_full.avia-slideshow img,
.avia-slideshow-inner img{
     min-height: 410px!important;
     min-width: 960px!important;     
}

    Best regards,
    Vinay

    • This reply was modified 8 years, 10 months ago by Vinay.
  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.