it's very simple
HTML Tag is
<div class="button">
Read More
</div>
Css is
.button{
width:100px;
height:30px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
background: -moz-linear-gradient(top, #89ae56 0%, #85a06d 100%);
background: -webkit-linear-gradient(top, #89ae56 0%, #85a06d 100%);
background: linear-gradient(top, #89ae56 0%, #85a06d 100%);
position:relative;
color:#fff;
line-height:30px;
padding-left:10px;
}
.button:after{
content:"+";
position:absolute;
width:20px;
height:20px;
background:#5f5f5f;
-moz-border-radius:20px;
-webkit-border-radius:20px;
border-radius:20px;
color:#fff;
text-align:center;
right:5px;
top:5px;
line-height:20px;
}
HTML Tag is
<div class="button">
Read More
</div>
Css is
.button{
width:100px;
height:30px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
background: -moz-linear-gradient(top, #89ae56 0%, #85a06d 100%);
background: -webkit-linear-gradient(top, #89ae56 0%, #85a06d 100%);
background: linear-gradient(top, #89ae56 0%, #85a06d 100%);
position:relative;
color:#fff;
line-height:30px;
padding-left:10px;
}
.button:after{
content:"+";
position:absolute;
width:20px;
height:20px;
background:#5f5f5f;
-moz-border-radius:20px;
-webkit-border-radius:20px;
border-radius:20px;
color:#fff;
text-align:center;
right:5px;
top:5px;
line-height:20px;
}


0 comments:
Post a Comment
Your mail id not publish..