Firebug修复相同的CSS？答案

【问题标题】：Firebug fixing same css?Firebug修复相同的CSS？
【发布时间】：2013-06-24 21:39:50
【问题描述】：

CSS：

.list-a .desc-fix {
    width: 180px;
    margin: 0px auto;
    position: relative;
}
.list-a .desc {
    background: url("../images/trans_black.png") repeat;
    display: block;
    font-family: arial;
    font-size: small;
    height: 18px;
    margin: 3px 0 0 50px;
    overflow: hidden;
    padding: 10px;
    position: absolute;
    width: 180px;
    z-index: 3;
    right:30px;
    left:30px
}

HTML：

<span class="desc-fix">
    <span class="desc">
        <h4>Text A</h4>
        <h5>Text B</h5>
    Long text long text long text Long text long text long text Long text long text long text Long text long text long text Long text long text long textLong text long text long text Long text long text long text
    </span>
</span>

上面是我的代码，用于对齐绝对定位的跨度以在中间对齐。

但是当我加载页面时它没有在中间对齐。

当我更改（我认为不是真正的更改）任何 css 并通过 Firebug 将其更改回原始值时，它会居中对齐。有什么想法，发生了什么？

【问题讨论】：

你的css代码在哪里？
你的html代码中的list-a在哪里
@falguni 我可以在问题顶部看到我的 css 代码
@Aravind30790 它是 desc-fix span 的父级

标签： html css firebug css-position center-align

【解决方案1】：

你可以试试下面的代码，将这些跨度包装在一个类中。检查这个JSFiddle

.list-a .desc-fix {
    width: 100%;
    height: 100%;
}
.list-a .desc {
    background: url("../images/trans_black.png") repeat;
    display: block;
    font-family: arial;
    font-size: small;
    margin: 3px 0 0 50px;
    padding: 10px;
    max-width:300px;
    max-heigtht: 400px;
    width: 100%;
    height: 100%;
}
.list-a {
    width:300px;
    height:400px;
    margin: 0px auto;
}

【讨论】：

【解决方案2】：

您应该始终将您的 css 类链接到它们的直接父级，例如：

.list-a span .desc-fix {)
.list-a span .desc {)

或者只是

span .desc-fix {}
span .desc {}

它可以在其他浏览器中使用吗？

编辑：试一试https://stackoverflow.com/a/7720742/2516336

【讨论】：