Question

我这里有一个小提琴：

我试图将部分文本保持在可用空白的中心位置，但它似乎坚持正确。我怎样才能将它相对于＆＃34;细胞＆＃34;？

<aside id="side-browser">
    <a href="#">Folder One</a> <br/>
    <a href="#">Folder Two</a><br/>
    <a href="#">Folder Three</a><br/>
</aside>
<section>
    <h1>Section Content</h1>
</section>

section {
    text-align: center;
    display: table-cell;  
}

aside {  
    display: table-cell;  
    width: 300px;
}

Answer 1

section {
    text-align: center;
    display: table-cell; 
    float:left;
    width:100%;
}

Answer 2

正如PSCoder所说，你的文字已经集中在一起。我已经更新了你的小提琴来说明发生了什么。 http://jsfiddle.net/e5QVZ/28/

正如3bu1所提到的，你需要调整你的宽度，直到达到你想要的效果。

为了显而易见，我添加了一个固定宽度为500px的容器div，

#container{width:500px;border:1px dotted #09c;}
section {background-color:#afa;
    text-align: center;
    display: table-cell;
    margin:0 auto;
    width:200px;
}

aside {background-color:#faa;  
    display: table-cell;  
    width: 300px;
}

如何将内容相对于细胞居中？

2 个答案: