Ширина изображения 100%, без горизонтальной прокрутки

Question

У меня есть изображение, установленное на 100% ширину, которая работает правильно. Однако изображение создает горизонтальную полосу прокрутки, равную полной ширине изображения (1366 в этом случае). Я пробовал overflow:hidden;, но он ничего не делает. Как убить лишнюю полосу пробела/горизонтальной полосы прокрутки? Благодарю.

.header-image-inner img { 
    overflow: hidden; 
    width: 100%; 
} 

<div class="header-image-inner"> 
    <img width="1366" height="422" alt="banner" src="http://216.227.216.66/~mercantileportag/wp-content/uploads/2015/10/Home_BannerImage1.png"> 
</div> 

Answer 1

Переполнение должно быть применено к элементу контейнера, а не к самому элементу. Например:

.header-image-inner{ 
    overflow: hidden; 
} 

.header-image-inner img { 
    width: 100%; 
}