Question

在我的网站http://goo.gl/BcJtC部分＆＃34;关于我们＆＃34;我希望这张照片与行星在DIV中间水平对齐。我试过text-align：center;但它不起作用。任何的想法？感谢

HTML

<div class="section" id="plan-activite">
<div id="activity-container">
<div id="activity-left"><span class="activity-title">About Us</span><br /><img src="images/planet-water.jpg" class="activity-planet" alt="Picture" /></div>
<div id="activity-right"><p><span class="activity-conclusion">XYZ, naturlig mineralvann, ren natur</span></p><br /><p>XXZ AS was founded May 2011sdqsd.</p><br/>
</div>
</div>
</div><!--END page3-->

CSS

#activity-container
{
    width:90%;
    background-color:#FFFFFF;
    Height:400px;
    margin-left: auto;
    margin-right: auto;
    opacity:0.95;
    filter:alpha(opacity=95); /* For IE8 and earlier */
    border: 1px solid #efefef;
    background: #fff;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset;
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset; 
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset;
}

#activity-left {
color:#000;
margin: 0 auto; 
border-style:solid;
border-right-color:#666;
padding:15px;
width: 30%; 
float: left;
position: relative; 
}

#activity-right { 
font:12px 'Open Sans', "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight:400;
margin: O auto; 
padding:15px;
color:#000;
width: 60%; 
float: left;
position: relative; 
text-align:justify;
-moz-column-count: 1;
-moz-column-gap: 1.5em;
-moz-column-rule: 1px solid #c4c8cc;
-webkit-column-count: 1;
-webkit-column-gap: 1.5em;
-webkit-column-rule: 1px solid #c4c8cc;
}


.activity-planet
{
    text-align:center;
    margin-top:20px;
    margin-left:20px;
    }

Answer 1

如果您将display: block和margin: 0 auto;设置为img {

，则会有效

问题是在DIV中水平对齐图像

1 个答案: