我有一个HTML代码
- <div class="left">
- <span class="panelTitleTxt">Title text</span>
- </div>
我的CSS如下
- .left {
- background-color: #999999;
- height: 50px;
- width: 24.5%;
- }
- span.panelTitleTxt {
- display: block;
- width: 100%;
- height: 100%;
- }
现在我如何对齐div中的span文本？ (假设％转换后的“左”div的像素宽度为100像素)
我尝试使用margin：auto的标准方式，但是这不行。
我也想避免使用text-align：center。
还有其他一些修复方法吗？
解决方法
您将跨度的宽度设为100％，使其扩展到父级的大小。这意味着你不能对齐它，因为没有空间来移动它。
您可以将span设置为宽度，然后再次添加margin：0 auto。这将对齐它。
- .left
- {
- background-color: #999999;
- height: 50px;
- width: 24.5%;
- }
- span.panelTitleTxt
- {
- display:block;
- width:100px;
- height: 100%;
- margin: 0 auto;
- }
