css - CSS3: Creating Dots above a image without a div container -


on website of nintendo online post image, has little dots on due css. too, without using div container around image.

here current code:

.image {    background: url(http://nintendo-online.de/img/bg-game-header-cover.png) repeat;  }
<img class="image" src="http://media2.giga.de/2013/06/osx_hero_2x.jpg" height="250" width="500px">

what have change make visible? if set z-index 1 image goes 1 stage either. possible?

use :before or :after

http://jsfiddle.net/omjo21mk/

div {    background: url(http://media2.giga.de/2013/06/osx_hero_2x.jpg) repeat;      position: relative;      min-height: 200px;      -webkit-background-size: cover;  		-moz-background-size: cover;  			background-size: cover;  }  div:before{      content: '';      position: absolute; top: 0; left: 0;      width: 100%;      height: 100%;      background: url(http://nintendo-online.de/img/bg-game-header-cover.png) repeat;  }
<div></div>


Comments

Popular posts from this blog

android - MPAndroidChart - How to add Annotations or images to the chart -

javascript - Add class to another page attribute using URL id - Jquery -

firefox - Where is 'webgl.osmesalib' parameter? -