JSFiddle - React, Tailwind, and code Playground
HTML
<div class="button-book noselect" onclick="click();">
<p><img src="http://s011.radikal.ru/i318/1502/ca/b18450e6091b.png"> txt </p>
</div>
CSS
.button-book{
position: relative;
display: block;
float: left;
width: 160px;
height: 44px;
background: #f2795a;
border-radius: 5px;
color: #ffffff;
text-align: center;
font-size: 1.0em;
font-family: arial black, sans-serif;
border: 0;
z-index: 1;
}
.button-book > p {
position: relative;
display: block;
margin: 0;
padding: 0;
top: 25%;
}
/* по желанию можно повесить, чтобы текст не выделялся */
.noselect {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
cursor: default;
}
JavaScript
function click(){
alert("clicked");
}