2015-06-08 20 views
6

<div> etiketini, kendi CSS stillerimi eklemeden Semantic UI web geliştirme çerçevesini kullanarak bilinen herhangi bir yolu var mı?Semantik Kullanıcı Arabirimi - Dikey merkezleme bir

<div class="centered grid'> gibi documentation numaralı konum etiketiyle ilgili çeşitli girişimlerde bulundum, ancak bunlar yalnızca yatay merkezleme için çalışır.

Bu zorlu bir uygulama örneğidir, sadece dikey bir merkezleme, bir web geliştirme çerçevesi içinde yer almadığı kadar yaygın bir şeye şaşırdım ve Google aramalarımın ve gözlerimin üzerinde cam olup olmadığını merak ediyorum. Özel stiller oluşturmadan önce çerçeve stillerine uymayı tercih ederim. Kendi dikey merkezlememi uygulamak için birkaç yöntem olduğunu biliyorum (bu benim uygulamam için en az tercih edilen seçenek), ancak çerçeveden bir sınıf kullanmayı tercih ediyorum.

cevap

4

Semantik UI v2.2.2 başı olarak, middle aligned sınıf (lar) ekleyerek ortasında dikey hizalama zorlayabilir.

  • table, onun satırları ve hücreleri,
  • grid, onun satırlar ve sütunlar,
  • image,
  • list ve bir resim ile item,
  • kalıcı iletişim içeriği: Aşağıdaki öğeleri etkiler .

Sen bu yapıların herhangi dışında, keyfi bir div elemana ortada böyle dikey hizalama ayarlanmamış yapabilirsiniz.

Aksi takdirde, başka bir semantik UI öğeleri varsayılan olarak ortadan dikey olarak hizalamak:

İlgili konular