выровняйте изображение справа

Question

Мне нужно выровнять следующее изображение по левому краю в качестве примера, который я оставляю только для того, что не понимаю, потому что оно всегда оставляет мне запас сторон.

мой код: Html:

   <section class="container7">
        <div class="row">
        <div class="col-md-6 text-center w-75 p-3 w-responsive">
        <h1 class="h1-responsive font-weight-bold text-center my-5">Descarga nuestra app móvil</h1>

            <p class="text-justify w-responsive mx-auto mb-5">
                Descarga nuestra app y ten el servicio ¡Al alcance de tus manos!
            </p>
            <div class="row store text-center">
                <img width="30%" class="google d-flex justify-content-between align-items-center img-responsive " src="assets/images/google.png" />
                <img width="30%" class="apple d-flex justify-content-between align-items-center img-responsive" src="assets/images/apple.png" />
            </div>

        </div>
        <div class="col-md-6">
                <img width="75%" class="phone img-responsive" src="assets/images/phone.png" />
        </div>
        </div>
</section>

1011 * СКС *

.container7 {
    margin: 0;
    background: linear-gradient(135deg, #632878 9%, #862453 56%, #a83a39 100%);
    background-repeat: no-repeat;
    width: 100%;
    height: 100vh;
    position: relative;

    .phone{
     float: right; 
     margin-right: 0px;
     margin-bottom: 0px;
    }

}

ОШИБКА

Answer 1

Есть две вещи: во-первых, как уже сказал Нирадж, контейнер 7 должен быть закрыт до того, как откроется скоба телефона.Но во-вторых, вам нужно что-то добавить в свой код:

* {
    box-sizing: border-box;
    margin: 0;
}

.container7 {
    margin: 0;
    background: linear-gradient(135deg, #632878 9%, #862453 56%, #a83a39 100%);
    background-repeat: no-repeat;
    width: 100%;
    height: 100vh;
    position: relative;
}

.phone{
     float: right; 
     margin-right: 0px;
     margin-bottom: 0px;
}

Посмотрите здесь , по бокам нет белой или черной границы (или, как вы это называете: поле).

Редактировать: Так как это SCSS, вот правильный скрипт SCSS, который работает:

* {
    box-sizing: border-box;
    margin: 0;

    .container7 {
        background: linear-gradient(135deg, #632878 9%, #862453 56%, #a83a39 100%);
        background-repeat: no-repeat;
        width: 100%;
        height: 100vh;
        position: relative;

        .phone{
             float: right; 
             margin-right: 0px;
             margin-bottom: 0px;
        }
    }
}