文本对齐不起作用
[英]Text-Align Does not Work
问题描述
I have the following HTML code. 
我有以下HTML代码。 http://jsfiddle.net/Lijo/wJX9C/ http://jsfiddle.net/Lijo/wJX9C/
I need to align the contents (“HAI” and button) as center aligned. 我需要将内容（“ HAI”和按钮）对齐为中心对齐。 How do we correct it? 我们如何纠正它？
Note: It need to work in IE7, Chrome 注意：它需要在IE7，Chrome中运行
<html>
<div id="popup" class="popup">
<div id = "poupContentLine1" class="poupContentLine">
HAI
</div>
<div id = "poupContentLine2" class="poupContentLine">
<input type="submit" name="ctl00$detailContentPlaceholder$btnClose" value="CLOSE" id="detailContentPlaceholder_btnClose" />
</div>
</div>
</html>
Style 样式
.popup
{
width:530px;
background-color:#ffffff;
border:3px solid Orange;
padding: 10px 5px 10px 5px;
margin: 0px 0px 0px 0px;
}
poupContentLine
{
width:530px;
height:auto;
text-align:center;
margin: 0px 0px 0px 0px;
}
2 个解决方案
解决方案1
10 已采纳 2012-05-30 11:57:08
you missed a . 你错过了.
.poupContentLine
since it's a classname — example fiddle: http://jsfiddle.net/wJX9C/2/ 因为它是一个类名-小提琴示例： http : //jsfiddle.net/wJX9C/2/
解决方案2
1 2012-05-30 12:01:41
First, remove the popupcontentline styling; 首先，删除popupcontentline样式； it's unnecessary. 没必要 Then add text-align: center to .popup . 然后将text-align: center添加到.popup 。 Also, shorten it to margin: 0; 另外，将其缩短到margin: 0; (irrelevant to your problem, but all those "0"s aren't necessary and lengthen your code.) （与您的问题无关，但是不需要所有这些“ 0”并延长您的代码。）
Example: http://jsfiddle.net/wJX9C/10/ 示例： http ： //jsfiddle.net/wJX9C/10/
.popup
{
width:530px;
background-color:#ffffff;
border:3px solid Orange;
padding: 10px 5px 10px 5px;
margin: 0;
text-align:center;
}
Note: the HTML can also be simplified, but I didn't do anything with that. 注意：HTML也可以简化，但是我没有做任何事情。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.