Разследвани с CSS собственост вертикално подравняване, alexdev

«Вертикално подравняване не работи!" - вика уеб разработчик.

Вертикално подравняване е един от тези функции, CSS, което звучи доста очевидно, но това може да доведе до проблеми за разработчици. Мисля, че дори много CSS ветерани са изправени пред проблеми с този имот от време на време.

Повечето заблуди по отношение на вертикалната подравняване е, че ако се приложи към даден елемент, всички елементи в рамките на този елемент ще се променят вертикалното си положение. Например, когато ние използваме вертикално подравняване: отгоре елемент, съдържанието на елемента ще се издига на върха на елемента.

Това ми напомня за начина, по който направихме в дните, когато широко се използва табличен оформление:

В този случай, маса valign имот (старо) ще повиши цялото съдържание в TD-елемент нагоре.

Но вертикално подравняване не работи!

Как да се работи в действителност вертикално подравняване?

Вертикално подравняване имот е предмет на три правила:

1. Това се отнася само за да вградите или инлайн блокови елементи
2. Тя засяга подравняването на самия елемент, а не неговото съдържание (с изключение, когато собствеността се прилага към клетките таблицата)
3. Когато се прилага към клетки на таблицата, стойността се отразява на съдържанието, а не самата клетка.

С други думи, следния код, няма да има никакъв ефект:

Защо? защото

блоков елемент (блок. не вградено). Разбира се, можете да преобразувате

в вградени или вграден блок елемент, а вертикално подравняване ще има ефект.

От друга страна, когато се използва правилно (за вградени или вграден блок елемент единица), вертикално подравняване привежда цел елемент във връзка с други елементи.

Как ще бъде съобразен с високо нагоре или надолу елемент зависи от размера на вградени елементи на една и съща линия.

Тук е ясно доказателство, заедно с обяснителен текст, за да разберете какво се случва, когато използвате вертикално подравняване на вградени елементи:

Както може да се види, наляво 3 бяха притискащ елемент за нашата въображаема линия, както и правото на държавите с имот вертикално подравняване: отгоре се притиска към горния въображаемата линия. Въображаема линия варира в зависимост от размера на елементите.