悬停时的CSS3滑动图像,奇怪的间距

时间:2015-04-05 11:38:56

标签: android css html5 css3 hover

首先,大家好,我在这里有点新鲜,尽管这个网站帮助了我很多东西。 这就是我的问题,我已经在其后面生成了带有文字的图像,这样当您将指针悬停在它上面时,图像会滑到一边,您可以阅读文本。很简单。现在我遇到的问题是,当我降低屏幕尺寸时(例如在Android上查看它),响应式设计有点不适用于那些图像,因为它们有一些奇怪的间距。左边,即使图像可以适合该屏幕尺寸。

这里有问题的网站(我将其用于学习目的:)):This

1 个答案:

答案 0 :(得分:0)

你的响应工作正常(我猜是bootstrap)。问题是,.slide1, .slide2, .slide3中的宽度固定,导致col-sm-4的宽度为33.3333%。基本上你需要使用媒体查询来调整你的动画。

overflow:hidden添加到col-sm-4会更好地向您展示正在发生的事情,添加到幻灯片max-width:100%可能是修复网络的第一步。稍后您的问题将是图像大小