2

我想通过CSS实现以下

我有两个文本需要彼此相邻。示例：要在“电话”右侧的两个电话号码

电话：301xxxx

301xxxx

我可以使用两个 div 并将一个向左浮动来做到这一点。但我也希望他们两个都居中。构建它的最佳方法是什么？

4

5 回答 5

2

html:

<div class="blah">
  <div>
    Phone:
  </div>
  <div>
    301xxxxx<br>
    301xxxxx
  </div>
</div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

CSS：

​.blah {
    text-align:center
}
.blah > div {
    vertical-align:top;
    display:inline-block;   
}

演示

于 2012-08-06T17:35:39.840 回答
1

您是在谈论彼此相邻的 2 个 div，然后将它们居中放置在页面上吗？

可能

将宽度设置为两个 div 以及将文本居中对齐到里面的文本？

<div id="outter">
<div id="div1"> phone 1</div>
<div id="div2"> phone 2</div>
<div style="clear:both"></div>
</div>

css

#outter{
width: 400px;
padding: 0;
margin: 0 auto;
}
#div1, #div2{
width: 50%;
float: left;
text-align:center;}
于 2012-08-06T17:31:59.557 回答
0

您可以使用表结构来做到这一点：

<tr>
    <td>phone</td>
    <td>301xxxx</td><br />
    <td>301xxxx</td>
</tr>
于 2012-08-06T17:40:25.750 回答
0

然后将它们放入div居中的父级中。

为了使块元素居中div，我们必须设置它的width:和margin-left: auto; margin-right: auto;

于 2012-08-06T17:32:06.467 回答
0

演示：http: //jsfiddle.net/LRuZp/4/

于 2012-08-06T17:38:31.643 回答