Как выравнивает vertical-align в inline-block элементах?
Учебный код увидел по фиксированной (статичной верстке). Из него мне не понятно что делает vertical align. Я даже сделал рамку вокруг body , чтобы увидеть как по центру он два элемента ставит при vertical-align:middle; Но ничего не происходит. Или я свойство не понимаю это. Попытался текст какой то внутри написать, но он тоже не выравнивается вне зависимости от значения свойства vertical-align: top , middle или bottom. Что в этом коде делает vertical-align и как понять его работу тут ?
body {
border: 2px solid black;
}
* {
box-sizing: border-box;
margin: 0px;
padding: 0px;
}
.fixed {
display: inline-block;
vertical-align: middle;
background-color: blue;
color: white;
width: 900px;
height: 300px;
margin: 50px;
}
<body>
<div class="fixed">Знаешь, каждую ночь я вижу во сне море</div>
<div class="fixed">Знаешь, каждую ночь я слышу во сне песню.</div>
</body>
вот как изначально учебный пример выглядел , если надо 