public
Created

  • Download Gist
final.css
CSS
1 2 3 4 5 6 7
.date-picker { position: relative; width:250px; }
 
.date-picker .date-icon {
position:absolute;
top:15px;
right:-10px;
}
position_absolute.css
CSS
1 2 3 4 5
.date-picker .date-icon {
position:absolute;
top:0;
right:0;
}
position_relative.css
CSS
1 2 3 4 5 6 7
.date-picker { position: relative; width:250px; }
 
.date-picker .date-icon {
position:absolute;
top:0;
right:0;
}
sample.html
HTML
1 2 3 4 5 6 7 8 9 10
<div>
<h6>Example:</h6>
<div class="date-picker">
<input type="text" placeholder="TextBox with an Icon" class="date-input">
<a href="#" onclick="alert ('clicked');" class="date-icon">
<img src="http://s3.amazonaws.com/wimgo/images/wimgo-search-date-popup-icon.gif" alt="">
</a>
</div>
</div>

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.