CODEWITHSUNDEEP
htmlcss
adi radian
adi radian

Reputation: 43

make thumbnail croped by half html

hello im using bootstrap3, i have 3 inline thumbnail with image and i want to the last thumbnail got crop by half. can some of you help me to solve this proplem guys. i tried with overflow hidden. but the height of cropped thumbnail with the normal thumbnail become not the same

my css is like this

.imageList{
    display: inline-flex;
    margin-top: 10px
    }

heres the link for my js fiddle https://jsfiddle.net/px3t08jf/3/

Upvotes: 0

Views: 29

Answers (1)

Carol McKay
Carol McKay

Reputation: 2424

.imageList{
  display: flex;
  width:750px;
  overflow:hidden;
}

.thumbnail {
  flex:0 0 45%;
}

.thumbnail img {
  min-width:300px;
}

.thumbnail.crop-image {
  flex:0 1 10%;
}

https://jsfiddle.net/sjfxL045/

http://autoprefixer.github.io/

Upvotes: 1

Related Questions