Есть 2 блока в одном. Они должны быть:
1) Располагаться в одной строчке
2) Быть по разные стороны
4 ответа
.container {
display: flex;
justify-content: space-between;
background-color: gray;
padding: 1em;
box-sizing: border-box;
}
.container div {
width: 5em;
height: 2em;
background-color: blue;
}
<div class="container">
<div></div>
<div></div>
</div>
Задать float-ы для дочерних блоков. И clear для родителя.
div1 {
float: left;
}
div2 {
float: right;
}
main-div:after {
content:'';
display:table;
clear:both;
}
.container {
width: 100%;
}
.container div{
width: 50px;
height: 50px;
background-color: green;
}
.container div:nth-child(1) {
float:left;
}
.container div:nth-child(2) {
float:right;
}
<div class="container">
<div></div>
<div></div>
</div>
.container {
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
}
.container div{
width: 50px;
height: 50px;
background-color: green;
}
<div class="container">
<div></div>
<div></div>
</div>