İyonik 2 - İki satırda simge ve metin ile iyon düğmesi nasıl yapılır?

Question

DURUM: simge ve metin: my İon 2 uygulamasında

İki çizgi menü düğmesine olması gerekir. Sorun, bir şekilde iyon düğmesi yönergesinin düğmenin bir satırda olmasını zorlamasıdır.

Düğmenin her zaman doğru biçimlendirme ve konumlandırmaya duyarlı olduğundan emin olmak için iyon düğmesi yönergesine ihtiyacım var. Sadece iki satıra olmak için bu düğmeye ihtiyacım var.

Bu benim girişimi html ve css:

HTML:

<ion-header> 
    <ion-navbar> 
     <button ion-button menuToggle="left" start> 
     <ion-icon name="menu"></ion-icon> <br /> 
     <p class="menuSubTitle">MENU</p> 
    </button> 
    <ion-title> 
     HomePage 
    </ion-title> 
     <button ion-button menuToggle="right" end> 
     <ion-icon name="person"></ion-icon> <br /> 
     <p lass="menuSubTitle">LOGIN</p> 
    </button> 
    </ion-navbar> 
</ion-header> 

CSS:

.menuSubTitle { 

     font-size: 0.6em; 
     float:left; 
     display: block; 
     clear: both; 
    } 

SORU:

İki satıra iyon düğmeyi nasıl yapabilirim?

Teşekkürler!

Answer 1

Yazma çizgileri boyuncasınız. Çalışması için hafif bir değişiklik gerekiyor.

<button ion-button block color="menu-o"> 
    <div> 
     <ion-icon name="flash"></ion-icon> 
     <label>Flash</label> 
    </div> 
</button> 

düğmenin içinde iç div hiledir:

İşte benim işaretleme yöntemidir. Bu biçimlendirme için gereken tek şey label element to display block

<p> zaten bir blok seviyesi elemanıdır. Sadece olduğu gibi çalışabilir.