图像漂浮在DIV

我有一个图像有问题。图像不是浮动的，但它在中心工作。但是，我想图像浮动和div的中心..这是我的代码。图像漂浮在DIV

HTML

<div class="middle-align"> 
    <div id="gallery-left"> 
     <div class="gallery-left-middle"> 
      <p class="gallery-photo"> <a rel="gallery_group" href="#" title=""><img alt="" src="assets/images/welcome.jpg" /></a> </p> 
      <p class="gallery-photo"> <a rel="gallery_group" href="#" title=""><img alt="" src="assets/images/welcome.jpg" /></a> </p> 
      <p class="gallery-photo"> <a rel="gallery_group" href="#" title=""><img alt="" src="assets/images/welcome.jpg" /></a> </p> 
      <p class="gallery-photo"> <a rel="gallery_group" href="#" title=""><img alt="" src="assets/images/welcome.jpg" /></a> </p> 
     </div> 
    </div> 
</div>

CSS

.gallery-left-middle {text-align:center;} 
#gallery-left img{float:none;display:inline-block;width:180px;height:180px;}

我跟着这个问题：Question solved。但它仍然不起作用。

问题是图像不漂浮，但它在中心。有任何想法吗？

来源

2014-03-03 Anthosiast

参见定位和浮动w3cschools。 – alexmac

这是因为p是块级元素，它会自动填补他的父母div的width因为img有text-align:center，它是在p元素的中心。如果您想让这些图像浮动，您可以尝试在这些p元素上设置display:inline-block而不是img元素。

.gallery-left-middle {text-align:center;} 
.gallery-photo {display: inline-block;} 
img{width:180px;height:180px;}

Working Fiddle

来源

2014-03-03 03:05:23 Krab

图像漂浮在DIV

回答

相关问题