position-absolute-semi-replaced-stretch-other-ref.html (832B)
1 <!DOCTYPE html> 2 <style> 3 .cb { 4 position: relative; 5 border: 3px solid black; 6 height: 100px; 7 width: 150px; 8 display: inline-block; 9 vertical-align: top; 10 margin: 5px; 11 } 12 .wide { 13 width: 350px; 14 } 15 .abs { 16 margin: 0; 17 position: absolute; 18 box-sizing: border-box; 19 top: 3px; 20 left: 3px; 21 outline: 2px solid lime; 22 width: calc(100% - 6px); 23 height: calc(100% - 6px); 24 } 25 </style> 26 <div class="cb"><select class="abs"><option>select</option></select></div> 27 <div class="cb"><output class="abs">output</output></div> 28 <div class="cb"><label class="abs">label</output></div> 29 <div class="cb"><fieldset class="abs">fieldset</fieldset></div> 30 <div class="cb wide"><textarea class="abs">textarea</textarea></div> 31 <div class="cb wide"><progress value="0.4" class="abs"></div> 32 <div class="cb wide"><meter value="0.4" class="abs"></div>