html - How to change stacking order of bg image? -


how can make mouth, eyes, , eyebrows appear on top of face without changing html? (the mouth in wrong position can see it)

    <body>  <div id = "shoulders">      <div id = "face">         <div class = "eyebrow" id = "lefteyebrow"> </div>          <div class = "eyebrow" id = "righteyebrow"> </div>          <div class = "eye" id = "lefteye"> </div>          <div class = "eye" id = "righteye"> </div>          <div id = "mouth"></div>      </div>  </div> </body> 

https://jsfiddle.net/tvkhb8zt/

you have several ways achieve want.

  1. as mentioned before can use z-index. remember if have complicated structure of page not recommended use z-index.

  2. easier approach may use simple relative/absolute positioning. here article of explaining css positioning. jsfiddle example of image positioned mouth , head on top of shoulders.


Comments

Popular posts from this blog

inversion of control - Autofac named registration constructor injection -

verilog - Systemverilog dynamic casting issues -

ios - Change Storyboard View using Seague -