Question

我知道我错过了一些明显的东西... DIV有一个固定的宽度，图像有一个固定的宽度，这应该是一个快照......

<style>
  .featured {margin:0 auto;}
</style>
<div style='width:300px;border:solid 1px red;'>
    <img src='http://www.musicalads.co.uk/img/articles/image_64.jpg'
         class='featured' style='width:186px;height:215px;'>
</div>

您可以在此处播放：http://jsfiddle.net/AHjAk/

Answer 1

如果您计划使用display: block;左/右边距对其进行居中，则还需要向图片添加auto

http://jsfiddle.net/AHjAk/1/

Answer 2

或尝试这个简单的text-align:center;容器 http://jsfiddle.net/AHjAk/2/

 <div style='width:300px;border:solid 1px red;text-align:center'>
<img src='http://www.musicalads.co.uk/img/articles/image_64.jpg' class='featured'>
</div>

Answer 3

尝试将text-align:center添加到应居中图像的父gif。

<style>
  .featured {margin:0 auto;}
</style>
<div style='width:300px;border:solid 1px red;text-align:center'>
    <img src='http://www.musicalads.co.uk/img/articles/image_64.jpg'
         class='featured' style='width:186px;height:215px;'>
</div>

如果您想将父母div本身居中，那么您的身体需要text-align:center。

为什么这个图像不是固定宽度的DIV中心？

3 个答案: