Nivo Slider custom height/width problems

后端 未结 1 1468
心在旅途
心在旅途 2021-01-18 16:24

I have searched for a resolution to my problem, but have not yet been successful.

I have images of different sizes in Nivo Slider, but I need to create

相关标签:
1条回答
  • 2021-01-18 16:48

    If I understand correctly what you want to achieve is something like this (uncommenting /*overflow: hidden;*/): DEMO

    HTML:

    <div>
        <img src="http://i.imgur.com/cjgKmvp.jpg"/>
    </div>
    

    CSS:

    div{
        position: relative;
        margin: 100px auto;
        width: 400px;
        height: 300px;
        border: 3px solid red;
        /*overflow: hidden;*/
    }
    
    img {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translateX(-50%) translateY(-50%);
        -ms-transform: translateX(-50%) translateY(-50%);
        transform: translateX(-50%) translateY(-50%);
        min-width: 100%;
        min-height: 100%;
        width: auto;
        height: auto;
        z-index: -1;
    }
    

    Note: I comment overflow: hidden; so you can see how the image is positioned.

    0 讨论(0)
提交回复
热议问题