不能居中图像

我不能在div中居中图像。给定以下标记，如何将图像居中？不能居中图像

的HTML代码如下：

<div id='post-area' style='background:#000; padding:20px 0;'> 
    <a class='fancybox' rel='group' href='example-big.png'> 
    <img src='example.png' /> 
    </a> 
</div>

CSS代码如下：

#post-area { 
    font-size:13px; 
    color:#000; 
    text-align:left; 
    width:450px; 
    height:auto; 
    font-family:Meera 
    clear:both; 
    margin-top:20px; 
    letter-spacing:normal; 
} 

#post-area img { 
    max-width:250px; 
    height:auto; 
    float:none; 
    margin:0 auto; 
}

如果有什么办法做到这一点

来源

2012-07-23 McLosys Creative

*注：*你的CSS'字体family'财产是missi ng分号。此外，HTML应该有双引号，而不是单引号。 – arttronics 2012-07-23 02:27:39

如果你只是想中心图像水平，你可以改变文本对齐：左到文本对齐：中心。

来源

2012-07-23 02:22:53 mrkleinig

这不起作用了。如果父'div'是'position：absolute;'，我不认为这会起作用 – username 2015-11-15 16:39:43

在#post-area的CSS中尝试使用text-align:center。

这里是中心对齐的your example fiddleimg。

来源

2012-07-23 02:25:33 Asif

HTML

<div id='post-area' style='background:#000; padding:20px 0;'> 
    <a class='fancybox' rel='group' href='example-big.png'> 
    <img src='http://blog.spoongraphics.co.uk/wp-content/uploads/2011/colourful-logo/18.jpg' /> 
    </a> 
</div>

CSS

#post-area { 
    font-size:13px; 
    color:#000; 
    text-align:center; 
    width:450px; 
    height:auto; 

    font-family:Meera; 
    clear:both; 
    margin-top:20px; 
    letter-spacing:normal; 
} 

#post-area img { 
    max-width:250px; 
    height:auto; 
    float:none; 
    margin:0 auto;

}

看到演示： - http://tinkerbin.com/gWYGnA6m

来源

2012-07-23 05:44:24

不能居中图像

回答

相关问题