Ionic: Kann nicht den Text der Ionenlistenelemente auszurichten

Question

Ich versuche, den Text zentral innerhalb der ion-list Elemente auszurichten, text-align mit text-align: center innerhalb der folgenden CSS-Code verwendet:

.my-profile-bar-content{ 
     padding-top:34px ; 
     height: 250px; 
     text-align: center; 
     } 

Aber ich weiß nicht, warum ich das erste Element bin immer (die ‚Login‘ ein) aus wird mit den anderen zentriert, hier ist der Screenshot:

Und das ist mein verwendet HTML-Code:

<ion-popover-view> 
    <ion-header-bar class="my-profile-bar-header"> 
    <span class="my-profile"> 
     <img src="../img/no-face.png"> 
     <h1 class="title" style="margin-top: 20px">My Full Name</h1> 
     </span> 
    </ion-header-bar> 
    <ion-content class="my-profile-bar-content"> 
     <ion-list> 
<ion-item menu-close ng-click="login()"> 
Login 
</ion-item> 
<ion-item menu-close href="#/app/search"> 
Search 
</ion-item> 
<ion-item menu-close href="#/app/browse"> 
Browse 
</ion-item> 
<ion-item menu-close href="#/app/playlists"> 
Playlists 
</ion-item> 
</ion-list> 
    </ion-content> 
    </ion-popover-view> 
</script> 

Jede Hilfe wird sehr geschätzt.

Answer 1

Mit Hilfe von Entwickler-Tools (F12 oder Rechtsklick -> letzte Option) prüfen, welche zusätzlichen Stilregeln auf dieses spezielle Menü angewendet werden. Es ist wert zu beachten, dass Login Knopf ist ein Knopf, nicht href, was bedeutet, dass andere Stil Regeln für Tasten möglicherweise gestört haben.