Assalamu'alaikum wr wb,
kali ini saya akan share bagaimana cara buat icon search sebelah kanan di dalam input text di css.
Berikut ini syntaxnya.
-------------------------------------------------
<style type="text/css">
@import url("//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css");
body
{
margin: 30px;
}
.search
{
position: relative;
color: #aaa;
font-size: 16px;
}
.search input
{
width: 250px;
height: 32px;
background: #fcfcfc;
border: 1px solid #aaa;
border-radius: 5px;
box-shadow: 0 0 3px #ccc, 0 10px 15px #ebebeb inset;
}
.search input { text-indent: 5px;}
.search .fa-search {
position: absolute;
top: 10px;
margin-left: -30px;
float: right;
}
</style>
<div class="search">
<input placeholder="Search term">
<span class="fa fa-search"></span>
</div>
-------------------------------------------------
Semoga bermanfaat.
http://pangeran-it.blogspot.com/