Попытка наследовать ширину тега img в css

Question

Я пытаюсь наследовать ширину идентификатора тегу img, чтобы изображение никогда не превышало идентификатор вокруг него. Но как-то наследовать не работает, но когда я использую ширину с абсолютным значением, как 580px, это работает. Мне интересно, почему это не работает.

так выглядит в Chrome Inspector.

и это важная часть моего кода CSS.

#content {
  position: absolute;
  font: 16px/1.5 'PT Serif', Times, Cambria, serif;
  width: 580px;
  left: 50%;
  margin-left: -100px;
}

#content p,
#content ul {
  margin-bottom: 25px;
}

#content ul {
  padding-left: 20px;
}

#content li {
  margin-bottom: 5px;
}

#content div.actions {
  margin-top: 25px;
  font-size: 14px;
  font-family: 'Open Sans Condensed', sans-serif;
}

#content div.actions .readmore {
  text-decoration: none !important;
  padding: 0 2px;
}

#content div.actions .readmore:hover {
  background-color: #389dc1;
  color: #fff;
}

#content div.actions .comments {
  color: #ccc;
  margin-left: 10px;
  text-decoration: none;
}

.post {
  padding: 50px 0 15px 0;
  border-bottom: 1px solid #dfdfdf;
}

.post .date {
  font: bold 12px 'Open Sans Condensed', sans-serif;
  text-transform: uppercase;
  color: #a7a7a7;
  margin: 24px 0 30px 20px;
  position: relative;
}

.post .date:before {
  width: 18px;
  height: 18px;
  position: absolute;
  content: '';
  left: -22px;
  top: -1px;
}

.post img {
  width: inherit;
}

Answer 1

Проверьте здесь: Наследование ширины на фиксированном div не работает

Ключевое слово inherit указывает, что свойство должно наследовать свое значение от своего родительского элемента.

Здесь у вас есть p тег в родительском.