Featured Post Slider Not Displayed Properly on Mobile Phones

  • Resolved theologosnet

    (@theologosnet)


    5 years, 6 months ago

    I am using this for my Poseidon Child Theme style.css:

    .post-slider .zeeslide .slide-image {
	max-width: 100%;
    max-height: 200px;
}

    And all poseidon-header-image size set to have the 200px height using the Simple Image Sizes plugin (enough for displaying post titles).

    The homepage looks OK for desktop view but not OK for mobile view. I have tried this to fix the mobile view:

    @media (max-width: 600px) {
.zeeflex-viewport, .zeeflexslider .zeeslides > li {
    max-height: 200px;
	min-height: 75px;
}
.post-slider .zeeslide .slide-image {
    max-height: 100px;
	min-height: 75px;
}
}

    But somehow it does not work. When the screen width is below 600px, the header image height changes with it.

    How to solve this problem? Help is appreciated!

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Thread Starter theologosnet

    (@theologosnet)

    Anyone can help?

    Theme Author ThemeZee

    (@themezee)

    Hi there,

    Thanks for using Poseidon.

    The Post Slider is scaled proportionally down on smaller screens, so a slider image with 1920 x 200 pixel simply won’t work well on mobile devices. There is no way around that with how the slider is implemented. Setting a larger height on small screens will only distort the image.

    You basically have to rewrite huge parts of the whole slider, but I recommend to go for a slider plugin or a complete new slider implemented with a child theme. The default slider of Poseidon is just not built for this.

    Best,
    Thomas

    Thread Starter theologosnet

    (@theologosnet)

    OK, thanks for taking the time to reply!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Featured Post Slider Not Displayed Properly on Mobile Phones’ is closed to new replies.