用图像缩放整张表

Question

我正在制作这个响应性网页：http://jsfiddle.net/GeDxr/174/

我需要把屏幕上的图像分开，所以我把它们放在桌子上。问题是，当调整大小时，表会出错。有没有办法保持屏幕的整洁形象，由这些不同的部分组成？

单元格css中的当前表/图像：

    table {
    width: 100%;
    background-color: #00BF6E;
    min-height: 100%;
}

img {
    width: auto;
    height: auto;
}

谢谢!

Answer 1

你的照片上有一分钟高。我在折叠代码中为您注释了这一点：

.css-mb .mb-screen img {
  width: 100%;
  /* min-height: 100%; <-- remove this */
  position: center;
}

如果你给出一个最小宽度和一个最小高度，图像将被扭曲，因为宽度高度比变化(它们都填补了100%的可用空间)。只使用一个最小宽度可以确保比率保持不变。