HTML では width に ％ 指定出来ないとの事なのですが、以下の様に HTML に記述したところ問題なく表示できました。
この場合は、CSS では無く HTML に記述したまま進めた方が良いのでしょうか？
しかし、何故 HTML に記述しても問題無かったのかが解りません。。

// HTML
<section class="hero">
      <img src="img/hero1.png" alt="素敵なソファー" 
      width="100%"
      height="400px"
      />
</section>

// CSS
/* hero */
.hero img {
   object-fit: cover;
 }