SORU
30 NİSAN 2010, Cuma


Nasıl divs dikey olarak hizalamak için?

Küçük bir kullanıcı adı ve parola giriş kutusu için çalışıyorum.

Sormak istiyorum, nasıl dikey bir div align musunuz?

Ben ne var:

<div id="Login" class="BlackStrip floatright">
   <div id="Username" class="floatleft">Username<br>Password</div>
   <div id="Form" class="floatleft">
   <form action="" method="post">
      <input type="text" border="0"><br>
      <input type="password" border="0">
   </form>
   </div>
</div>

Nasıl ıd Kullanıcı adı ve Form div dikey merkezine sağlamakla yapabilir miyim? Vermeye çalıştım:

vertical-align: middle;

oturum Açma kimliği ile div CSS, ama işe yaramıyor. Herhangi bir yardım mutluluk duyacağız.

CEVAP
27 Aralık 2013, Cuma


Dikey olarak diğer div içinde bir div align edebilirsiniz. Bunun için example on fiddle bu gibi css tanımlamanız gerekir. Sadece bakın dikey outerDiv bir innerDiv align küçük bir demo.

HTML

<div class="outerDiv">
    <div class="innerDiv"> My Vertical Div </div>
</div>

CSS

.outerDiv {
    display: inline-flex;  <== This is responsible for vertical alignment
    height: 400px;
    background-color: red;
    color: white;
}

.innerDiv {
    margin: auto 5px;   <== This is responsible for vertical alignment
    background-color: green;   
}

8* *sınıf marjı margin: auto *px; gibi olmalı

[* istediğiniz bir değer olabilir.]

display: inline-flex özelliği(güncel sürüm/güncelleme) HTML5 destekleyen tarayıcılarda son desteklenir.

Her zaman dikey olarak hizalamak dıv (yani innerDiv) başka uyumluluk sorunu için yüksekliği tanımlamak için deneyin.

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • Austin Evans

    Austin Evans

    5 AĞUSTOS 2007
  • olinerd

    olinerd

    23 AĞUSTOS 2007
  • YAN TV

    YAN TV

    20 EKİM 2011