Почему это работает? - Twitter Bootstrap 2.3.1

Question

Я недавно posted a question, где я спросил, как я могу вертикально выровнять отзывчивое изображение. Я нашел ответ самостоятельно, но он поднял еще больший вопрос, потому что я понятия не имею, как и почему он работает.

Взгляните на этом jsFiddle: http://jsfiddle.net/fmwzT/1/

который использует следующий код для вертикального выравнивания изображения в навигационной панели:

<div id="f1"><div id="outer-element"><img id="inner-element" src="http://zx85.dyndns.org/raphtest/img/title.png" alt="Logo"></div></div> 

#fl { 
    float: left; 
} 

#outer-element { 
    display: table-cell; 
    vertical-align: middle; 
    height: 40px; 
    max-width: 301px; 
} 

#inner-element { 
    display: inline-block; 
    margin-left: -20px; 
} 

Однако без бутстрэпов последней версии (2.3. 1) это не работает! Взгляните на этот jsFiddle: http://jsfiddle.net/fmwzT/2/

Это второй jsFiddle не включает в себя Boostrap 2.3.1, но содержит Boostrap 2.3.0 (содержится внутри внешнего CSS-файла я назвал layout.css) и пока она не работает.

Вопрос: Кто-нибудь знает, какая часть Twitter Bootstrap 2.3.1 заставляет изображение внутри навигатора реагировать?

Answer 1

Это присутствует в версии 2.3.1 (отзывчивым-combined.css), а не в предыдущих версиях:

img { 
    height: auto; 
    max-width: 100%; 
}