爲什麼元素的垂直對齊會影響其兄弟對齊？

<div class="bordered" style="height: 300px; text-align: center"> 
     <div class="bordered inline-blocked" style="height: 100px; vertical-align: middle">XXX</div> 
     <div class="bordered inline-blocked" style="height: 200px; vertical-align: middle">YYY</div> 
    </div>

Divs XXX和YYY彼此相對垂直居中，即它們在水平線上一個，但不是相對於容器垂直居中。這就是我想要的。爲什麼元素的垂直對齊會影響其兄弟對齊？

現在的問題：

如果我改變兩個垂直對齊的屬性奇怪的事情發生西港島線之一。

我刪除了XXX vertical-align屬性。結果：XXX向下移動並且定位爲無。 YYY保持不變。
我將YYY vertical-align屬性設置爲'top'。 YYY保持原位，XXX儘管自己的價值仍然「中等」，但仍與YYY的頂部一致。
我將YYY vertical-align屬性設置爲'bottom'。 YYY保持原位，XXX儘管自身價值仍然「中等」，但仍與YYY的底部保持一致。

我一直認爲，當一行中有幾個內聯元素時，它們形成一行內聯框，並且所有垂直對齊值都相對於該框應用，即行內框被垂直定位屬性不在其父代內部，而是在父代內部的內聯盒子行內，即在其兄弟姐妹行內。因此，如果我將XXX屬性設置爲'中間'，將YYY設置爲'底部'，那麼它應該與它們都設置爲中間的情況完全相同，因爲假想內聯框的大小和位置是沒有改變。但事實上，如果它們中的兩個都不是垂直對齊到中間，我不能將這些框垂直居中。

那麼你能解釋一下這個簡單例子裏發生了什麼嗎？

我無法得到的另一件事是如何在此示例中的定位受到行高屬性的影響。

答：