javascript - Angular Strap tab does not update tab content until browser resize -

i using following code use tabs within modal.

<div bs-tabs>     <div ng-repeat="tabs in filters" title="{{ tabs.title }}" name="{{ tabs.title }}" bs-pane>         <label class="tag-checkboxes col-sm-6" ng-repeat="tag in tabs.filters | orderby: 'name'">             <input type="checkbox" ng-model="tag.checked" ng-change="modifyfilter(tag)"> {{tag.name}}             </input>         </label>     </div> </div> 

which pulls it's data json source structured this:

{     "title": "difficulty",     "icon": "difficulty-icon",     "filters": [{         "name": "easy",         "checked": false     }] }, {     "title": "equipment",     "icon": "equipment-icon",     "filters": [{         "name": "rope",         "checked": false     }     }] } 

this works in chrome 47, in chrome 38 (annoying specific browser have target due closed network) content of tab (all checkboxes) not show until browser resized or open inspector, changes dom guess.

does have idea how can solved?

ok issue causes issue inputs within modals. following css fixes this.

the position: fixed; seems break things.

.modal.center .modal-dialog{     position:absolute !important;     top:40%;left:50%;     min-width:320px;     max-width:630px;     width:50%;     -webkit-transform:translatex(-50%) translatey(-50%);     transform:translatex(-50%) translatey(-50%) }