更改图像显示为内嵌

我正在制作一个图像滑块。我试图显示图像内嵌.i也apllied css也不工作:(图像不显示内联。哪些属性需要更改请帮助。更改图像显示为内嵌

<div id="f1_container"> 
    <div id="f1_card1" class="shadow"> 
     <div class="front face"> 
      <img src="thumb1.jpg" style="height: 281px; width: 450px;" /> 
     </div> 
     <div class="back face center"> 
      Some text inside here 
     </div> 
    </div> 
    <br/> 
    <br/> 

    <div id="f1_card2" class="shadow"> 
     <div class="front face"> 
      <img src="thumb2.jpg" style="height: 281px; width: 450px;" /> 
     </div> 
     <div class="back face center"> 
      text2 
     </div> 
    </div> 
</div>

这是我的CSS文件，

#f1_container { 
    position: relative; 
    margin: 10px auto; 
    width: 450px; 
    height: 281px; 
    z-index: 1; 
} 
#f1_container { 
    -webkit-perspective: 1000; 
    perspective: 1000; 
} 
#f1_card { 
    width: 100%; 
    height: 100%; 
    -webkit-transform-style: preserve-3d; 
    -webkit-transition: all 1.0s linear; 
    transform-style: preserve-3d; 
    transition: all 1.0s linear; 
} 
#f1_container:hover #f1_card { 
    -webkit-transform: rotateY(180deg); 
    transform: rotateY(180deg); 
    box-shadow: -5px 5px 5px #aaa; 
} 
.face { 
    position: absolute; 
    width: 100%; 
    height: 100%; 
    backface-visibility: hidden; 
    -webkit-backface-visibility: hidden; 
} 
.face.back { 
    display: block; 
    -webkit-transform: rotateY(180deg); 
    transform: rotateY(180deg); 
    box-sizing: border-box; 
    color: white; 
    text-align: center; 
    background-color: #aaa; 
}

感谢和问候，

来源

2013-04-25 anam

尝试给图像一个显示：inline和float：left – 2013-04-25 09:49:10

图像默认为内联级元素。但是，在你的情况下，图像嵌套在'div'元素中，默认情况下是块级元素。所以你的努力应该是使'div'容器成为内联级元素，而不是图像。 – Boaz 2013-04-25 09:51:56

你试过跨度吗？顺便说一句，它看起来很好..不能说有什么问题 – 2013-04-25 09:54:03