响应式缩略图模态盒

Question

有人能帮我找到一个“响应式拇指模特盒”来工作吗？

Code so far:

http://jsfiddle.net/YCcNY/1/

它应包括：

• 2行，每张5张
• 动态高度:自动
• 宽度:屏幕的75%
• 始终保持屏幕的绝对中心。
• 调整大小时保持高宽比(响应)

我希望css是唯一的方法，但jquery也不错。

Answer 1

对基本结构做了一些快速的更改，使您能够在正确的轨道上开始。

Code:

http://jsfiddle.net/purplenurple/YCcNY/29/

有很多不必要的CSS。一定要小心，不要把事情复杂化。CSS有时是这样的，您认为需要添加一些东西来解决问题，但实际上您需要消除最初并不明显的问题。

注:如果没有JavaScript，就不可能垂直地将其居中，因为模态盒和其容器都没有固定的高度。您必须通过脚本获得高度，并相应地设置框的位置。

我没有为您实现任何JavaScript，因为StackOverflow的目的不是外包您的工作，而是帮助您自己找到解决方案:)

希望这能帮你重新走上正轨。