如何阻止图片元素占用100％的宽度？

这似乎很简单，但没有我试图工作......我有一个图像被分配了一个类。图像具有一定的宽度，但分配给图像的类占用父div的宽度的100％，无论我做什么。如何阻止图片元素占用100％的宽度？

HTML：

<div class="parent"> 
    <%= image_tag("picture.png"), class:"image" %> 
</div>

CSS与青菜：

.parent { 
    width 100%; 
    position: relative; 
    text-align: center; 
    .image { 
    position: absolute; 
    height: 80%; 
    max-height: 1000px; 
    } 
}

使用我在网路上找到各种各样的回答，我已经试过给人.imagewidth: auto不同的组合， display:inline和display:inline-block，但无论我做什么，.image拒绝100％退出。我怎样才能使.image只有它包含的图像一样宽？

来源

2015-04-05 Joe Morano

这不是无礼或Haml的问题，只提供了编译CSS/HTML。 – cimmanon 2015-04-05 02:40:14

对我来说，它看起来像代码完全按照你想要的。 http://jsfiddle.net/svgaa0tp/ – janlindso 2015-04-05 02:42:14

原来我不得不将该类添加到图像本身，而不是再培训局弦：

<div class="parent"> 
    <%= image_tag ("picture.png", class:"image") %> 
</div>

来源

2015-04-06 05:15:24

<div class="parent"> 
    <img src="path" class="image" width="20%" /> 
</div>

来源

2015-04-05 06:56:04

如何阻止图片元素占用100％的宽度？

回答

相关问题