Merkezi hizalama düğmeleri metni div içinde dinamik olarak mı?

Question

Bulduğum çok fazla çözüm denedim, ancak hiçbir şey benim için çalışmıyor gibi görünüyor.

Düğmenin genişliğine ve yüksekliğine bakılmaksızın, düğmenin içindeki metni dinamik olarak ortalamak istiyorum, metnin her zaman ortada olması gerekir, bunun için iyi bir çözüm olduğundan eminim. Kendimi her zaman onunla mücadele ederken bulurum.

<div class="gform_button"> 
    <input type="submit" class="gform_button" value="Submit" /> 
</div> 

Aşağıdaki kod neden çalışmıyor hemen her şeyi, ben anlamıyorum çalıştı:

.gform_button{ 
    text-align: center; 
    vertical-align: middle; 
} 

Birisi bana bunun nasıl çalıştığını iyi bir açıklama verebilir lütfen ve yukarıdaki iki çizgi neden metni ortalamıyorsa, bu onların amacıdır. Her zaman bir şeyleri merkezlemekle uğraşıyorum.

Şimdiden teşekkürler!

Answer 1

, metin içerisindeki input[type='submit'] gerektiğini Alway orta hizalı olacak (dikey/yatay). Stillerinizi iki kez kontrol edin, belki div/input öğenizin kenar boşluğunu/dolgusunu kırdınız.

Answer 2

bu deneyin:

HTML:

<div class="gform"> 
    <input type="submit" class="gform_button" value="Submit" /> 
</div> 

css: sizin için de

input.gform_button{ background-color:blue;color:white} 

jsfiddle: Varsayılan olarak

https://jsfiddle.net/bnhf5hg9/5/ 

Answer 3

<style type="text/css"> 
.gform_button{ 
    text-align: center; 
    vertical-align: middle; 
    padding:3px; 
} 
</style> 

<div> 
    <input type="submit" class="gform_button" value="Submit" /> 
</div>