0

私は次のCSSを持っています:

   .side-study-box {
    background-color: white;
    color: black;
    border: 3px solid #0072A6;
    text-align: center;
    height: 220px;
    margin-bottom: 15px;
    margin-top: 15px;
    display: table;

    -webkit-box-shadow: 3px 3px 3px #888888;
    -moz-box-shadow: 3px 3px 3px #888888;
    box-shadow: 3px 3px 3px #888888;
}
    .side-study-box p {
        position: relative;
        width: 100%;
        margin: auto;
        font-size: 24px;
        display: table-cell;
        vertical-align: middle;
    }

そして、次の HTML:

<div class="side-study-box span6 ">
     <p>SIDE 1</p>
</div>

ただし、テキストは垂直方向または水平方向に中央揃えされていません。CSS の side-study-box ではなく、div から span6 クラスを削除するか、span6 をターゲットにすると、機能します。私は両方のクラスが必要ですが...何が間違っていますか?

4

1 に答える 1

2

span6クラス名を対象とする別のルールが影響しているように思えます。特異度を上げてみてください。#idセレクターを追加するか、接頭辞を付けbodyます。何かのようなもの：

body .side-study-box { /*...*/ }
body .side-study-box p {/*...*/ }
于 2013-03-22T18:21:28.720 に答える