html - Css居中框百分比工作原理

Question

如何删除右侧的剩余空间： HTML 代码：

    <div class="wrapper">
        <a href="#"><h1>Title 1</h1></a>
        <a href="#"><h1>Title 1</h1></a>
        <a href="#"><h1>Title 1</h1></a>
    </div>

CSS 代码：

.wrapper {
height:                                                         450px;
margin:                                                         50px;
border-radius:                                                  30px;
overflow:                                                       hidden;
background-color:                                               #F00;
border:                                                         1px solid #000;
display:block;
}
.wrapper a {
    width:                                                      33.3%;
    height:                                                     100%;
    background-color:                                           #444;
    margin:0 auto;
    float:                                                      left;
    color:                                                      #fff;
    text-decoration:                                            none;
    display:inline-block;
}
.wrapper a:nth-child(2) {
    background-color:                                           #333;
}
.wrapper a h1 {
    width:                                                      100%;
    height:                                                     70px;
    text-align:                                                 center;
    position:                                                   relative;
    bottom:                                                     0;
    text-shadow:                                                1px 1px #000;
}

http://jsfiddle.net/6bXQ9/

3 个块必须是 33,3 %，但其余 (0,1%) 不会被填充，我使用 33,4% 当页面较小时会丢失 1 个块

我应该用什么？谢谢！对不起我的英语不好

Answer 1

width: 33.33%做魔术。

Answer 2

这是你想要的吗？http://jsfiddle.net/6bXQ9/5/

width: 33.33%;

制作宽度：33.33% 解决您的问题。