html - Move png's with CSS -


how can put arrow in button box? suggestions code appreciated.

html:

<!--header--> <div class="mainheader header">     <h1>         let make awesome idea happenn     </h1>     <div class="button">         <p class="">             watch video         </p><img src="playbutton.png">     </div> </div> 

css:

.button {     width: 250px;     height: 46px;     border: solid white 2px;     margin: 0 auto;     z-index: 2;     position: relative;     top: 70%; } .button p {     text-align: center;     font-size: 20px;     font-family: 'teko', sans-serif;     color: white;     position: relative;     bottom: 20%; } 

http://codepen.io/anon/pen/rppqpv

body{    background: #000;  }    button {    width: 250px;    height: 46px;    margin: 0 auto;    background: none;    border: solid white 2px;      z-index: 2;    position: relative;      text-align: center;    font-size: 20px;    font-family: 'teko', sans-serif;    color: white;      }
<button>           watch showreel           <img src="http://iconizer.net/files/splashyfish/orig/arrow_medium_down.png">        </button>


Comments

Popular posts from this blog

javascript - Bootstrap Popover: iOS Safari strange behaviour -

Website Login Issue developed in magento -

Can the constants be defined inside a model file of a framework in PHP? -