Я понимаю, что width: '100%' позволяет ширине объекта быть такой же, как и его родительская, тогда как width: inherit делает это только в том случае, если явно указана ширина родительского элемента. Правильно ли это понимание?
Если это так, мне кажется, что когда width: inherit работает, тогда width: '100%' всегда будет работать, поэтому вы всегда можете использовать последнее. Тогда, какова цель написания width: inherit? Когда это станет полезным?
Если мое понимание неверно, в чем разница между этими двумя?
Аналогично height.
См. jsfiddle http://jsfiddle.net/bt5nj/2/ и http://jsfiddle.net/bt5nj/3/
width:inherit наследует ширину, определяемую родительским.
HTML:
<div id="parent">
<div id="child"></div>
</div>
CSS
#parent
{
width:50%;
height:30px;
}
#child
{
width:inherit;
height:100%;
background-color:red;
}
Это делает ширину child шириной 25%, но если я переопределю ее с помощью width:100%, она будет определять ширину child 50%.