Как сделать так, чтобы картинка не наследовала ширину и высоту собственной колонки?

Question

[flare0n]

Вот как у меня выглядит на сайте:

Скрин

А вот как выглядит это в psd:

Скрин

Так же прилагаю

коды блока

<section class="information">
    <div class="container">
      <div class="row">
        <div class="col-7">
          <div class="information__block-text">
            <h2 class="information__title">Lorem ipsum dolor sit amet consectetur!</h2>

            <p class="information__text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut.aliquip ex ea commodo consequat.</p>
            
            <p class="information__text">Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  
            <p class="information__text">Sed ut perspiciatis unde omnis iste natus error sit</p>
            <button class="button">Read more</button>
          </div>          
        </div>
        <div class="col-5">
          <div class="information__img">
            <img src="img/information/information_1.jpg" alt="Velocopter">
          </div>
        </div>
      </div>
      <div class="row">
        <div class="col-7">
          <div class="information__img">
            <img src="img/information/information_2.jpg" alt="Velocopter">
          </div>
        </div>
        <div class="col-5">
          <p class="information__text">
            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor.
          </p>
        </div>
      </div>
    </div>
  </section>

.information
	padding-top: 100px
	&__block-text
		margin-right: 88px
	&__title
		margin-top: 99px
		margin-bottom: 49px
		font-size: 60px
		font-weight: 400
		line-height: 60px
	&__text
		margin-bottom: 38px
		font-size: 18px
		font-weight: 300
		line-height: 28px
		letter-spacing: 1.08px
	&__img
		height: 100%
		width: 100%
	.row
		margin-bottom: 100px

.

Пробовал делать .container-fill, но это приводит к тому, что приходится делать отступы каждому блоку.

Answer 1

[Андрей Саврасов]

Картинка растягивается на 100% ширины блока.

height тянется пропорционально.

Убери height и ограничь max-width;

Answer 2

[flare0n]

Проблема решена. В файле reset.css было установлено значение

img {
  max-width: 100%;
}

После того как убрал, картинка стала нормальной по размерам. Внутренние отступы помогли отрегулировать блок текста. А так же, как оказалось, у текста 7 колонок, а у картинки - 5