垂直對齊離子圖標和文本

我想釋放一種日期選擇器，中間的日期和左/右切換上一個或下一個日期。我目前在格式化視圖時遇到問題。我想垂直對齊離子圖標（左側&右側）和文字{{displayDate}}。我試過以下，但沒有我想要的結果。垂直對齊離子圖標和文本

HTML

<ion-footer> 
     <div style="position: fixed; bottom: 0px; width: 100%"> 
     <ion-list> 
      <ion-item text-center style="align-content: center!important"> 
       <ion-icon name="md-arrow-dropleft" style="font-size: 30px; margin-right: 10px"></ion-icon> 
      <b> {{displayDate}} </b> 
      <ion-icon name="md-arrow-dropright" style="font-size: 30px; margin-left: 10px"></ion-icon> 
      </ion-item> 
     </ion-list> 
     </div> 
      <ion-toolbar> 
      </ion-toolbar> 
     </ion-footer>

CSS

b { 
    color: #387ef5; 
    font-family: 'Helvetica Neue', sans-serif; 
    }

它的外觀現在：

來源

2017-02-23 Sandruna

b { 
    color: #387ef5; 
    font-family: 'Helvetica Neue', sans-serif; 
    line-height: 30px; 
}

來源

2017-02-23 14:01:16

測試它。可悲的是沒有效果。 – Sandruna

@Sandruna真的嗎？給我你的項目鏈接。我在瀏覽器檢查器中看過這個 –

試試用這個！希望這對你有用！

b { 
    color: #387ef5; 
    font-family: 'Helvetica Neue', sans-serif; 
    vertical-align: middle; 
}

來源

2017-02-23 14:09:04

垂直對齊離子圖標和文本

回答

相關問題