Question

我正在制作一个网格来显示产品。网格是连续构建的几个div，宽度设置为百分比。是否可以水平居中文本而不改变div的设置方式？

非常欢迎所有建议！

HTML

<div class="container21-b">
    <div class="blok21-a">
        </a> <a class="text-container-price"> € 29,95 </a>
    </div>
</div>

CSS

 .container21-a {
    position: relative;
    height: 155px;
    margin-bottom: 20px;
    width: 12.95714%;
    float:left;
    overflow: hidden;
    margin-right: 1.55%;
}
.container21-b {
    position: relative;
    height: 155px;
    margin-bottom: 20px;
    width: 12.95714%;
    float:left;
    overflow: hidden;
}
.blok21-a {
    position: relative;
    height: 155px;
    margin-bottom: 20px;
    background-color:#f9f9f9;
}
.blok21-a:hover {
    position: relative;
    height: 155px;
    margin-bottom: 20px;
    background-color:#f5f5f5;
}
.text-container-price {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    display: inline-block;
    font: Verdana;
    color: #777;
    font-size: 11px;
    padding-bottom: 10px;
    ;
    vertical-align: bottom;
}

JSFiddle

Answer 1

设置text-align:center;

.blok21-a {
   position: relative;
   height: 155px;
   margin-bottom: 20px;
   background-color:#f9f9f9;
   text-align:center; /* <------ */
}

这是工作版：http://jsfiddle.net/doniyor/PRjU5/

如何在不知道.div宽度的情况下水平居中文本

1 个答案: