2

<span>コンテナにタグを使用してをに設定すると、コンテンツが複数の行にラップされない限り、display: inline-blockコンテナはコンテンツをシュリンクラップします。複数の行にラップされる場合、コンテナの幅はデフォルトで100％になります。ラップされたコンテンツをシュリンクラップする方法はありますか？これが私のコードです（http://jsfiddle.net/T8uGm/）：

HTML

<span class="wrapper">
    <a href="#" class="block"></a>
    <a href="#" class="block"></a>
    <a href="#" class="block"></a>
    <a href="#" class="block"></a>
    <a href="#" class="block"></a>
    <a href="#" class="block"></a>
    <a href="#" class="block"></a>
</span>​

CSS

.block {
    display: inline-block;
    width: 100px;
    height: 100px;
    background: blue;
}
.wrapper {
    display: inline-block;
    border: solid 1px black;
}
4

2 に答える 2

-1

使用するwhite-space:nowrap;

.wrapper {
    display: inline-block;
    border: solid 1px black;
    white-space:nowrap;
}

デモ

于 2012-07-12T06:37:24.700 に答える
-1

このcssを試してください：

.block {
        display: inline-block;
        min-width: 100px; /* The fix minimum width of span/div */
        width: 19.5%;  /* Depending how much box in 1 row. Exm: 5 block = 20% (19.5% to give space) */
        height: 100px;
        background: blue;
    }
于 2012-07-12T07:06:26.220 に答える