html - force images in same div to overlap -


<div style='width:10px'>    <a style="z-index : 1;cursor: pointer; text-decoration: underline; padding: 0px 3px 0px 0px; float: left;">     <img src='myimage.png' />   </a>    <a style="z-index : 1;margin-left: 4px; padding: 0px 3px 0px 0px; float: left;" >     <img src='myimage2.png' />   </a>  </div> 

http://jsfiddle.net/n5q06r59/

with code, 2 images displayed below each other. if increase width of main div, images correctly displayed beside each other.

how force elements displayed beside each other, getting rather overlapped drawn below in case of limited space?

you can use display table/table-cell display beside. like:

div{     display:table; } a{     display:table-cell; } 

and remove float:left anchor tag.

check fiddle here.


Comments

Popular posts from this blog

c++ - Difference between pre and post decrement in recursive function argument -

php - How can I echo out this array? -

javascript - IE11 incompatibility with jQuery's 'readonly'? -