1105268-2-min-max-dimensions-ref.html (791B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <style> 6 .wrapper { 7 display: inline-block; 8 vertical-align: top; 9 margin: 20px; 10 } 11 .outer { 12 height: 250px; 13 width: 200px; 14 border: 10px solid #ddd; 15 } 16 .inner { 17 overflow: hidden; 18 background: yellow; 19 } 20 .test1 { 21 width: 100px; 22 height: 150px; 23 } 24 .test2 { 25 width: 150px; 26 height: 100px; 27 } 28 </style> 29 30 </head> 31 32 <body> 33 34 <div class="wrapper"> 35 <div class="outer"> 36 <img class="inner test1" src="foo"> 37 </div> 38 </div> 39 40 <div class="wrapper"> 41 <div class="outer"> 42 <img class="inner test1" src="foo" dir="rtl"> 43 </div> 44 </div> 45 46 <br> 47 48 <div class="wrapper"> 49 <div class="outer"> 50 <img class="inner test2" src="foo"> 51 </div> 52 </div> 53 54 <div class="wrapper"> 55 <div class="outer"> 56 <img class="inner test2" src="foo" dir="rtl"> 57 </div> 58 </div> 59 60 </body> 61 </html>