2

我正在尝试将包含在锚标记中的图像水平居中。我尝试将其设置为块并将边距设置为自动,但没有成功。我已经尝试将它包装在一个 div 标签中并做同样的事情,仍然没有运气。甚至尝试将 div 中的 img 居中在 div 中。我看了其他帖子,似乎没有任何帮助。无论我做什么,图像仍然与左侧对齐。

###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; 时不起作用 或位置:绝对;

于 2013-02-07T05:42:31.807 回答