3

コンテンツ付きのdivを含むdivがあります。外側のdivには動的な幅があります（例：80％）。内側のdivの幅は固定されています（例：100px）。

問題は、図1のように、内部divが「オーバーフロー」/「カット」されないように、内部divのみを表示したいということです。

また、図2に示すように、「空き」スペースを、均等に分散された内部div間のマージンとして「分散」させたいと思います。

誰かが私の問題を理解し、cssとできるだけ少ないjavascriptでこれを実現する方法を知っていることを願っています:)

画像の例

PS：簡単にできるのであれば、最初と最後のdivに最大値を設定することは可能でしょうか。外縁へのマージン？

4

1 に答える 1

1

あなたがより多くの情報であなたの質問を編集する前にこれを始めました、しかしあなたが求めている1つの欠けている部分はtext-align: justify「外側」にあると私は信じます。

.outer{
    background: red;
    width: 80%;
    overflow: hidden;
    height: 48px;
    text-align: justify;
}

.inner{
    background: blue;
    width: 100px;
    height: 40px;
    margin: 4px;
    display: inline-block;
}​

これがフィドルです。

max-marginの意味は完全にはわかりませんが、コンテナに左右に固定のパディングを付けることで実現できるようです。

于 2012-12-12T19:36:31.057 に答える