CSS问题,无法将图像置于分区内

时间:2014-04-07 06:49:51

标签: html css html5 css-float

查找ID为shelf的分区和使用类inner_div的嵌套分区,现在问题是inner_div内的图片在使用下面提供的css类后不会居中。

CSS CLASS

.inner_div{
  display:inline_block;
  width:20%;
  float:left;
  font-size:10px;
  text-align: center;
}
.inner_div p{
  text-align:center;
  margin-left:2px;
  margin-right:2px;
  /*font-weight:bold;*/
  padding:2px;
  height:35px;
  border-radius:5px;
  color:rgb(255,255,255);
  background-color:rgb(51,51,51);   
 }

我的目录的简单结构

<div id='shelf'>
  <div class='inner-div'>
  <p>BOOK TITLE<p>
  <img src=''></img> //book cover
  <img src=''></img // available or not
  </div>
  <div class='inner-div'>
  <p>BOOK TITLE<p>
  <img src=''></img> //book cover
  <img src=''></img // available or not
  </div>
  <div class='inner-div'>
  <p>BOOK TITLE<p>
  <img src=''></img> //book cover   // not able to center this two images 
  <img src=''></img // available or not // not able to center this two images 
  </div>
    .......continues till data available in database


</div>

2 个答案:

答案 0 :(得分:0)

试试这个。你没有为图像指定任何CSS。可能它应该工作

.inner_div img {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

答案 1 :(得分:0)

试试这个:

.inner_div img {
    display:block;
    margin:auto;
}