How to set header(fixed div on top) in ion-content before ion-refresher


My code:

<ion-view title="XXX">
    <div class="row" style="height: 40px; line-height: 40px; padding: 0px; ">
        <div class="col col-20">search:</div>
        <div class="col">
            <input type="text" style="height: 30px; margin-top: 5px" ng-model="">
        <div class="col col-10" ng-click="search()"><i class="icon ion-ios7-search"></i></div>

When I drop down on my screen to refresh page, the drop down gesture also affect on row div
The ‘refresh…’ message before row div
I want to fix row div on top, only refresh ion-list
How can i do that?


Hey :smile:

Can you put this into a codepen? It can really help to solve the issue.



This is example code for my problem:

want to fix search row and only list area can be drop down when I refresh



You can use a ion-header-bar with a class of sub-header for this :smile:


I found your codepen example also has the issue described here


Thanks for your help.


THANK YOU @mhartington! :slight_smile: You’re good :slight_smile: