Support » Plugin: MetaSlider » Fixed height possible?

  • Resolved slatbh


    I’m trying to use the slider in a responsive theme to display images in the header.

    I would like the images to maintain their height with a varying width. I’ve tried using

    .metaslider .nivo-main-image, .metaslider .nivo-slice, .metaslider img{
    height: 250px;

    in CSS to set the height. It works until the image changes, but then I see that height has gone back to ‘auto’ when using the element inspector in Safari. I assume that this is happening in the javascript of the plugin (i.e. recalculation).

    Is there any way to overide this? I suspect not but would like confirmation.

    Thanks in advance

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Contributor matchalabs



    I also suspect not, I don’t think it’s a good idea to try setting heights with responsively scaled images.

    If you put an !important after your CSS rule it should override the styles that nivoslider applies to the elements automatically, but I suspect it would break it – worth a try though.


    Hi Tom

    Thanks for your reply, I was too busy to answer yesterday.

    I managed to achieve what I wanted by doing 2 things. First, was your suggestion of adding the !important to my CSS height above and add a minimum width.

    .metaslider .nivo-main-image, .metaslider .nivo-slice, .metaslider img{
    height: 250px !important;

    The other thing I needed to do was set the enclosing <div> for your slider to be:

    width: 100%;

    Thanks for your help and I copy my solution here to help others

    Plugin Contributor matchalabs


    Hi Siatbh,

    Great to hear you got it sorted, and thanks for posting the solution!


    That worked for me as well, thx!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Fixed height possible?’ is closed to new replies.