Во время анимации тени повялвется лишний отступ слева. Как починить?

Question

[Павел migelonio]

Во время анимации box-shadow, появляется лишний отступ на странице, слева (до тех пор пока я не обновлю страницу). Что это может быть и как исправить?

HTML:

<div class="portfolio_photos">
        <img class="port_img" src="blog.png" title="we offer blogs">
        <img class="port_img" src="media.png" title="we pffer media content">
        <img class="port_img" src="news.jpg" title="we offer news projects">
    </div>

CSS:

.portfolio_photos .port_img {
    position: relative;
    float: left;

    height: 400px;
    width: 400px;

    box-shadow: 12px 14px #595959;
    transition: box-shadow 1s;
    

    margin: 30px;

}

.portfolio_photos .port_img:hover {
    box-shadow: 20px 22px black;
    cursor: pointer;
    
}

Comments

[ambisinister One]

Отступ слева в 30px?

[Павел migelonio]

ambisinister One, не знаю.

[Павел migelonio]

ambisinister One, margin мне нужно для того, чтобы сделать отступы между элементами в ряду

[ambisinister One]

Павел migelonio, Отступы можно устанавливать со всех четырёх сторон перманентно.

[Павел migelonio]

ambisinister One, ?

[ambisinister One]

Павел migelonio, перманентно - как угодно.
Уберите слева, добавьте справа, сверху или снизу.

[Павел migelonio]

ambisinister One, можете код прислать?

[ambisinister One]

Павел migelonio, точно как с boxshadow
Да и код у Вас готов.
Немного подправить и готово.

[Павел migelonio]

ambisinister One, можете конкретно прислать то, что нужно подправить) (повторяю, появляется отступ, когда навожу мышью. Отступ не уходит пока не обновлю страницу)