Reputation: 95
Set the max height to be 10% of the page height. With a max width to be 10% of the pages width
For example if
Page height is 100px
Page width is 200px
Or
Page height is 200px
Page width is 100px
I would like my image to be set to 10px wide and 10px height
10% of whichever is smaller; the height or width of the page.
I've tried
width: 10%;
height: 0;
padding-bottom: 10%;
and
max-width: 10%;
max-height: 10%;
but they only effected by the width of the page, not the height.
Upvotes: 1
Views: 338
Reputation: 95
figured it out
width: 10vmin;
height: 10vmin;
CSS does 10% of the the smaller of the two, height or width
http://caniuse.com/#feat=viewport-units
Upvotes: 1