将两个文本相邻并居中对齐

Question

我想通过CSS实现以下内容

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

手机的右侧：301xxxxx

301xxxxx

我可以做到这一点使用两个DIV和浮动一个向左。但是我也希望他们都能够以中心为中心。什么是构建这个最好的方法？

Answer 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;} 

Answer 2

然后把它们放入居中的父母div。

为中心块elemnts像div，我们要设置它的width:和margin-left: auto; margin-right: auto;

Answer 3

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; 
} 

DEMO

Answer 4

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

Answer 5

你可以用表结构做到这一点：

<tr> 
    <td>phone</td> 
    <td>301xxxx</td><br /> 
    <td>301xxxx</td> 
</tr>