Поэтому в основном я плаваю все мои элементы div (значки) влево и поле оставляло их для создания пространства. Между ними и я отображаю их в строке. Проблема, которую я сейчас имею в себе, заключается в том, что всякий раз, когда я наводил над собой один элемент (значок), остальные элементы перемещаются. Пожалуйста, вы можете объяснить, что вызывает это, спасибо большое. Примеры будут с радостью оценены.

CSS:

    .facebookIc{
    font-size: 80px;
    margin-left: 120px;

    -webkit-transition: font-size 0.3s linear;
    }

    i.icon-facebook-circled:hover{
        color: #3b5998;
        font-size: 90px;
        -moz-transition: all 0.3s ease-in;
        /* WebKit */
        -webkit-transition: all 0.3s ease-in;
        /* Opera */
        -o-transition: all 0.3s ease-in;
        /* Standard */
        transition: all 0.3s ease-in;


    }


    .twitterIc{

    font-size: 80px;
    margin-left: 120px;
    -webkit-transition: font-size 0.3s linear;
    }

    i.icon-twitter-circled:hover {
       font-size: 90px;
        color: #00aced;
        -moz-transition: all 0.3s ease-in;
        /* WebKit */
        -webkit-transition: all 0.3s ease-in;
        /* Opera */
        -o-transition: all 0.3s ease-in;
        /* Standard */
        transition: all 0.3s ease-in;
    }

.contactContent{
position: relative;
height: auto;
width:100%;
background: #b7d84b;
opacity: 0.8;
overflow:auto;
padding: 20px 20px;
}

HTML:

<section  id = "contactContent" class="contactContent">
<div>
<i class="icon-gplus-circled gplusIc"></i>
<i class="icon-facebook-circled facebookIc"></i>
<i class="icon-mail-circled mailIc"></i>
<i class="icon-twitter-circled twitterIc"></i>
<i class="icon-soundcloud-circled soundcloudIc"></i>
</div>
</section>