Еб*сь с этой фигней 11 часов (я новичок)
нужно поставить 1("info-footer") блок и 2("social") на 1 линию, но 2 постоянно перескакивает на 2 из за того, что в первом блоке display:flex.
вот код html&css
<footer>
<div id="info-footer">
<div>Новости</div>
<div>Поддержка</div>
<div>О сайте</div>
<div>На главную</div>
<div>Войти</div>
<div>Регистрация</div>
<div>Реклама</div>
</div>
<div id="social">
<a href="#" target="_blanke" title="Телеграм">
<i class="fab fa-telegram-plane" id="telegram"></i>
</a>
</div>
</footer>
footer {
float: left;
width: 99.4%;
padding: 0.3%;
border-top: 1px solid #a7a7a7;
background-color: #85959A;
padding-top: 12px;
padding-bottom: 10px;
font-family: 'Exo 2', sans-serif;
font-weight: 300;
}
#wrapper {
display: flex;
flex-direction: column;
height: 100%;
}
#content {
flex: 1 0 auto;
}
#info-footer {
display: flex;
justify-content: flex-start;
color: #ffffff;
margin-left: 1%;
margin-right: 0%;
width: 59%;
}
#info-footer>div {
padding: 10px;
width: 100px;
text-align: center;
font-size: 1em;
transition: box-shadow 0.3s ease;
-o-transition: box-shadow 0.3s ease;
-ms-transition: box-shadow 0.3s ease;
-webkit-transition: box-shadow 0.3s ease;
-moz-transition: box-shadow 0.3s ease;
}
#info-footer>div:hover {
box-shadow: inset 0 0 0 2px white;
}
#social {
width: 40%;
float: right;
color: #ffffff;
margin-left: 0%;
margin-right: 0%;
}
#social>a>i {
width: 100px;
text-align: center;
font-size: 4em;
transform: scale(0.8);
transition: all 0.3s ease;
-o-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
}
#social>a>i:hover {
transform: scale(1);
}
Спасибо всем кто поможет!