Трудно объяснить в заголовке, поэтому я уточню. Очевидно, я понимаю, что между двумя элементами, равными 100% ширины контейнера, нельзя добавить дополнительное пространство, но мне интересно, есть ли способ уменьшить ширину одного из них на 40 пикселей.
Я вполне уверен, что мог бы сделать это в JavaScript, если это необходимо, но если доступно более простое решение CSS, я бы предпочел использовать его.
Для дальнейшего объяснения я бы хотел 40 пикселей между двумя белыми элементами, показанными на этом изображении: https://gyazo.com/551af056aa516eac2ce3c7b16949a0fa
Как видите, у меня есть большой контейнер с левым и правым столбцом шириной 40% и 60% соответственно.
HTML:
CSS:
.homeContentContainer {
position: absolute;
width: 60%;
margin: 0 auto;
top: 70px;
left: 0px;
right: 0px;
}
.leftCol {
width: 40%;
height: 100%;
float: left;
}
.rightCol {
width: 60%;
height: 100%;
float: right;
}
.buyPanel {
width: 100%;
height: 230px;
margin: 40px 0 0 0;
}
.sellPanel {
width: 100%;
height: 230px;
margin: 40px 0 0 0;
}
Подробнее здесь: https://stackoverflow.com/questions/455 ... 0-40-width