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 - Nothing but 'run(); ' when browsing to my local project, how do I fix this? -

php - How can I echo out this array? -