Как добавить пространство между двумя элементами шириной 60% + 40%? ⇐ Html

[Anonymous]

Трудно объяснить в заголовке, поэтому я уточню. Очевидно, я понимаю, что дополнительное пространство не может быть добавлено между двумя элементами, ширина которых равна 100% ширины контейнера, но мне интересно, есть ли способ уменьшить ширину одного из них на 40 пикселей.
Я вполне уверен, что мог бы сделать это в JavaScript, если это необходимо, но если доступно более простое решение CSS, я бы предпочел использовать его.
Для дальнейшего объяснения я бы хотел, чтобы между ними было 40 пикселей. белые элементы видны на этом изображении: https://gyazo.com/551af056aa516eac2ce3c7b16949a0fa
Как видите, у меня есть большой контейнер с левым и правым столбцом шириной 40% и 60% соответственно.

Код: Выделить всё

.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;
}

Код: Выделить всё

buy panel
sell panel


buy panel


 

Подробнее здесь: https://stackoverflow.com/questions/455 ... 0-40-width