Допустим, у меня есть 2 дивыустановка 2 DIV рядом друг с другом
width: 140%;
padding: 13px;
height: 20;
float: left;
как сделать их рядом друг с другом? (Лучший способ я могу)
Допустим, у меня есть 2 дивыустановка 2 DIV рядом друг с другом
width: 140%;
padding: 13px;
height: 20;
float: left;
как сделать их рядом друг с другом? (Лучший способ я могу)
Попробуйте это:
<div>Hello</div>
<div>World</div>
div {
border:1px solid #000;
width: 200px;
height:100px;
margin: 10px;
display: inline-block;
}
Рассмотрим это, если страница 100% ..
Как являются 2 дивы в общей сложности 280% собираются, чтобы поместиться внутри 100% -ная страница?
Также высота должна быть указана как height: 20px;
.
Это было бы правильным способом, чтобы написать это:
div {
width: 50%;
float: left;
height: 20px;
padding: 13px;
box-sizing: border-box;
}
Или еще лучше:
div {
width: 50%;
display: inline-block.
height: 20px;
padding: 13px;
box-sizing: border-box;
}
Вы делаете дивы шире, чем экран с width:140%
делая их равной менее чем на 100% это то, что вы ищете example здесь мы устанавливаем ширину на 45%, учитывая отступ, чтобы правильно выровнять
.box {
width: 45%;
padding: 13px;
height: 20;
background:blue;
margin-right: 20px;
float: left;
}
для случая, который вы указали в своем вопросе, лучшее возможное решение у меня есть.
HTML
<div class="wrapper">
<div class="box"></div>
<div class="box"></div>
</div>
CSS
*{
box-sizing:border-box
}
.wrapper{
display:table;
width:280%;
}
.box {
width:50%;
display:table-cell;
border:solid 2px red;
padding: 13px;
height: 20px;
}
в основном table
макет с помощью div
можно достичь результата вы ожидаете.
Я взял 280% ширину для обертки div и 50% для ящиков, в конце концов это станет 140% для каждой отдельной коробки, как вы ожидали.
Работа fiddle
если у Вас есть 2 дивы с «ширина: 140%», вы не можете заставить их сидеть рядом друг с другом. Кроме того, вы используете «width: 50%» или меньше. –
Пожалуйста, предоставьте jsfiddle. – Alex
ширина 140% для одного div и в совокупности это станет 280%, а еще два div должны сидеть рядом друг с другом. это означает, что ваша страница будет иметь горизонтальную прокрутку. это то, что вы ищете? –