根据所述div的内容调整Div高度和宽度

时间:2013-01-14 14:43:04

标签: html css

我正在寻找一种纯粹的CSS方式,让容器div根据其中的内容自动调整它的宽度和高度,以便将上述内容集中在另一个div中。

我尝试将高度和宽度设置为自动,但这没有用。

非常感谢您提供的任何帮助。

提前致谢。

CSS:

.imageThumbnails {

    position: relative;
    margin: auto;
    height: auto;
    width: auto;
}

.imageThumbnailOne {

    position: relative;
    float: left;
    height: 78px;
    width: 91px;
    background-image: url("thumbnail1.png");

}

.imageThumbnailTwo {

    position: relative;
    float: left;
    height: 80px;
    width: 76px;
    background-image: url("thumbnail2.png");
    margin-left: 29px;
}

.imageThumbnailThree {

    position: relative;
    float: left;
    height: 76px;
    width: 89px;
    background-image: url("thumbnail3.png");
    margin-left: 29px;
}

HTML:

<div class="imageThumbnailsContainer">

    <div class="imageThumbnails">
        <div class="thumbnailOne"><a></a></div>
        <div class="thumbnailTwo"><a></a></div>
        <div class="thumbnailThree"><a></a></div>
    </div>

</div>

1 个答案:

答案 0 :(得分:1)

您需要清除.imageThumbnails div。您可以使用.imageThumbnails { overflow: hidden; }执行此操作。您还可以从所有内容中删除position: relative