html - How to make this image appear on top of the div -
i've never had problems before seems image doesn't want appear on top of div. i've tried z-index shows underneath.
image this: http://www.flaticon.com/free-icon/menu-button-of-three-lines-outline_60310
class="snippet-code-css lang-css prettyprint-override">#menu-square { height: auto; } #top-menu { height: 3em; width: 100%; background-color: black; }
class="snippet-code-html lang-html prettyprint-override"><!--all content--> <div id="sb-site"> <div id="top-menu"> <!--toggle sidebar menu-------------------------------------------------> <a href="#" class="sb-toggle-left button"><img src="../menu54.svg" id="menu-square"></img></a> </div> </div>
your problem background same color picture. see code below, i've changed background-color , it's working fine.
you don't need z-index
in situation. also, <img>
tags don't need closed: <img src="..." />
.
class="snippet-code-css lang-css prettyprint-override">#menu-square { height: 10px; width: 10px; } #top-menu { height: 3em; width: 100%; background-color: aliceblue; }
class="snippet-code-html lang-html prettyprint-override"><!--all content--> <div id="sb-site"> <div id="top-menu"> <!--toggle sidebar menu-------------------------------------------------> <a href="#" class="sb-toggle-left button"> <img src="http://cdn.flaticon.com/png/256/60310.png" id="menu-square" /> </a> </div> </div>
html css image position overlap
No comments:
Post a Comment