Question

我在容器中填充了图像，每个容器都显示内联块。

主滑块具有固定宽度（例如768px）和可调节的固定高度。我希望儿童图像及其容器适合该高度，并保持图像比例。当我在开发人员工具中或使用Javascript动态更改主滑块高度时，图像容器div保持相同的宽度，并且我在每个图像之间有一些空的空间（容器内的图像被缩放并保持纵横比）。

我尝试：

public partial class Customer
{
     private int customerIDField;

     private bool customerIDFieldSpecified;
     public int CustomerID 
     {
         get { return this.customerIDField; }
         set { this.customerIDField = value; }
     }
}

但问题仍然存在。

我能解决这个问题吗？

FIDDLE

Answer 1

你必须强制.image元素在任何情况下重新计算它的大小我认为你必须使用js

你可以这样做：

function reduceHeight() {
    document.getElementById("container").style.height = 200 + "px";
    $(".image").css('height', 200);
}

或：

JS

function reduceHeight() {
    document.getElementById("container").style.height = 200 + "px";
    $("container").addClass('reduced');
}

CSS

.reduced .image{
    height: 99%;
}

无论如何，我希望你接受这个想法，只是强迫它改变它的大小，改变填充，边框，工作等属性。

我希望这会有所帮助

当孩子调整高度时，内联块自动适合子宽度

1 个答案: