0

I want to align text box, 2 href tags has horizontally as parent div whole content display. while i move responsive also this style wants to remain the same.

<div class="filter_container" >
   <input type="text" name="cusid" max-length="10" placeholder="Search Work Category" maxlength="10" id="search_wc" class="inp">
   <a href="#" class="add_cate"  onclick="add_activity(this);"><img src="images/add_so.png" title="Add Activity" rel="tooltip" /></a>
   <a href="#" class="add_cate"  onclick="add_category(this);"><img src="images/add_so.png" title="Add Workcategory" rel="tooltip" /></a>
</div>
/* css */
.filter_container{
    display: block;
    width: 90%;
    margin: 5px auto;
    text-align: left;
    overflow: auto;
}
.add_cate{
    display: inline-block;
    vertical-align: middle;
    text-align: right;
    margin: 5px;
}
.inp {
   font-size: 22px;
   width: 80%; 
   float: left;
   padding:5px 10px;
   outline: none;
   margin: 5px 0;
   border: 1px solid white;
}
Tamizharasi
  • 59
  • 7

1 Answers1

0

Try this code:

DEMO

CSS

img
{
    width:100%;
}
.add_cate{
    display: inline-block;
    margin: 2%;
    width: 46%;
    float: left;
}
Manoj
  • 1,860
  • 1
  • 13
  • 25
  • Ya. your right. But i want these elements all in the same line. without any change of image original size . – Tamizharasi Feb 20 '14 at 07:13
  • Ya. Like these only. But width is not limited. it will suit with any size of window what i want to tell is width will be in % only. – Tamizharasi Feb 20 '14 at 07:28