Question

我试图将图像置于我创建的div中。我在这里错过了什么？我尝试在图像上添加一种风格，但这也没有用。

  <div class="wrapper-data">
<div class="data_row">
  <div class="data_cell1_100">
        <img  width="450" height="509" src="http://oedblog.electricstudiolt.netdna-cdn.com/wpcms/wp-content/uploads/apple-e1382039006457.jpg" /></div>   
  </div>

.wrapper-data {
position:relative;
width:100%;
border: none;
margin: 30px 0 0 0;
overflow: hidden;

}

.data_row {
    height:100%;
    min-height:100%;
    white-space:nowrap;
    display:table;
}

.data_cell1_100 {
    width:100%;
    display:table-cell;
    white-space:normal;
}

.data_cell1_100 img {
    display:block;
    margin: 0 auto;
}

Answer 1

.data_row还需要width:100%;

DEMO http://jsfiddle.net/8zs29/1/

原因：简短且友好，百分比宽度相对于父元素，您需要将其“传递”到目标元素。因此，如果您打算使用最外层元素的100％宽度，在您的情况下，具有100％视口的所有宽度，则所有前面的元素应该具有100％宽度。

Answer 2

使用班级width:100%;

将.data_row添加到div

div中的中心图像

2 个答案: