Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • April 30, 2016 at 10:10 am #624899
    Kai

    Hello,
    I use a content slider with different text length at each slide.
    The problem is: if the slide change from large text to a smaller one, the elements below the content slider are moving up. I don’t want this behavior.
    Is it possible to get the max hight of all contents of the slider and set that height to all contents?

    I know there is a solution if I use this CSS and write it for different screen-width e.g.:
    @media screen and (max-width: 1200px) {.avia-content-slider-inner {height: 300px !important;}}
    @media screen and (max-width: 1000px) {.avia-content-slider-inner {height: 450px !important;}}
    @media screen and (max-width: 800px) {.avia-content-slider-inner {height: 500px !important;}}

    But this is not handy and manageable!!

    Is there any known solution?

    Thanks
    Kai

    May 2, 2016 at 8:16 am #625523
    Rikard

    Hi Kai,

    Could you provide us with a link to the site in question so that we can take a closer look please?

    Regards,
    Rikard

    May 12, 2016 at 9:19 pm #631607
    Kai

    Hello Rikard,
    of course. Please find the link at the private content.
    Thanks a lot
    Kai

    May 16, 2016 at 5:48 am #632727
    Ismael

    Hi,

    The only workaround is to adjust the minimum height of the content slider based on the tallest or the item with the longest content. Or make sure that the items has the same length of content as much as possible.

    @media only screen and (max-width: 767px) {
#top .avia-content-slider {
    min-height: 367px;
}
}

    The code above should work for phones or small tablets.

    Best regards,
    Ismael

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.