How to fit the content to the header bar

ionic-v1
1

I’m new to ionic. Use v1. I need to fit the content to the header bar. My header bar contains 1 search box and two buttons. I’m unable to fit it to the size.

<ion-view >
<ion-header-bar class="bar-assertive" ng-controller="AppCtrl">
  
    <div class="col col-sm-10 col-xs-10">
                 <label class = "item  item-input-inset " style="text-align: right; border-radius: 5px;">
		    <i class = "icon ion-edit placeholder-icon"></i>
			<input type = "text" placeholder = "Search Anything" ng-click="goToPage('search')" />
		</label>
    </div
    <div class="col col-sm-1 col-xs-1">		
		      <button class="button  icon  button-clear icon-small ion-heart "></button>
    </div>
    <div class="col col-sm-1 col-xs-1">
 	<button class="button button-clear icon  icon-small ion-chatbubble"></button>
  </div>	

</ion-header-bar>
<ion-content>
content goes here.
</ion-content>`Preformatted text`
</ion-view >
2

@alian_soft

in your <ion-header-bar> add

style="height: auto;"

like this:

also you must to add a height to your search bar:

image

i add 40px; i thinks that is better.

Also you dont close a div tag.
Greetings.