Как заставить пространство между таблицей CSS (адаптивная веб-страница)
У меня есть таблица CSS, и я хотел бы иметь пространство между ячейками, но не слева от первого изображения и справа от последнего изображения.
Вот скриншот того, что у меня есть:
Вот скриншот того, что я хотел бы:
Текущий HTML-код:
<div id="footer">
<div class="lower"><img src="images/one.jpg" alt="Ring being put on finger"/></div>
<div class="lower"><img src="images/two.jpg" alt="The mens trousers"/></div>
<div class="lower"><img src="images/three.jpg" alt="Flowers"/></div>
<div class="lower"><img src="images/four.jpg" alt="The rings"/></div>
</div>
и CSS это
#footer {
display: table;
width: 100%;
max-width: 1024px;
margin-top: 1%;
}
.lower {
display: table-cell;
}
#footer img {
width: 100%;
height: auto;
max-width: 256px;
}
Пожалуйста, имейте в виду, что это адаптивная веб-страница, поэтому я хотел бы, чтобы пространство оставалось всегда, однако я бы хотел, чтобы пространство менялось в зависимости от размера устройства, поэтому используйте%.