2

アンカータグ内に含まれる画像を水平方向に中央揃えしようとしています。私はそれをブロックとして設定し、マージンを自動に設定してみましたが、運がありませんでした。私はそれをdivタグでラップして同じことをしようとしましたが、それでも運がありません。div内のdiv内でimgを中央に配置してみました。他の投稿を見ましたが、何も役に立たないようです。何をしても画像は左揃えになります。

### HTML

<div id="slideWrapper">
    <h1 id="slideHeading">This is a Header</h1> 
    <hr/>       
    <div class="centerMe">
        <a href="javascript:slidelink()" class="slideA">
            <img src="./images/Slides/cheeseBoards.jpg" name="slide" id="slideImg"/>
        </a>
    </div>
    <hr/>
    <div class="centerMe">
        <a href="javascript:slidelink()"class="slideA" id="slideText">Check out our services and other great stuff.</a>
    </div>
</div>

### CSS

.centerMe {
    margin-left: auto;
    margin-right: auto;
    border: 1px solid green;
    text-align: center;
}
#slideWrapper {
    border: 1px solid blue; 
}
#slideImg {
    display: block;
    height:500px;
    width:900px;
    border:1px solid red;
    margin-left: auto;
    margin-right: auto;
}

物がどこに置かれているかがわかるように、すべての周りに境界線を付けました。なんらかの理由で画像がdivに含まれていないようです。これはとても単純なはずのようです。どんな助けでも大歓迎です。ありがとう。

4

1 に答える 1

4

親から継承された float:left がないことを確認してください。マージン:0 自動; float:left; がある場合は機能しません。または position:absolute;

于 2013-02-07T05:42:31.807 に答える