html - 具有灵活子 LI 的 CSS2 : how to achieve UL with 100% width,，每个子 LI 之间都有固定宽度的边距？

Question

基本上我想知道如何实现这一目标:

100% UL 有 5 x 20%( float )LI child ，中间有 3px 间隙。 LIs 必须是灵活的 (%) 宽度，以便它们可以调整大小，但它们的间隙必须是固定的。

这可以使用 CSS3 width: calc(20%-3px) 来完成，但我需要更多基本的 CSS2 支持。 :(

请问最简洁的方法是什么？

Answer 1

好吧，这有点变通，因为它使用容器的背景颜色作为边框，但它按预期工作(并且使用 CSS2.1)。

jsFiddle Demo

.outer {
    background: lime;
    border: 2px solid black;
    display: table;
    width: 100%;
}
.inner {
    display: table-cell;
    background: green;
    width: 20%;
    height: 50px;
    border-left: solid 3px lime;
}
.inner:first-child {
    border-left: none;
}