css - flexslider 图像不居中

Question

我正在使用基于 javascript/css 的flexslider作为将“幻灯片放映”合并到简单网页中的简单方法。

然而，“当前”图像不在 flexslider div 框中居中；并且在“当前”图像的左侧仍然可以看到“先前”图像的一部分（问题示例）。

关于我做错了什么有什么想法吗？

Answer 1

尝试在滑块功能中添加以下选项：

 $('.flexslider').flexslider({
    animation:"slide",
    controlsContainer: ".flex-container",
    itemWidth: 0,                   //{NEW} Integer: Box-model width of individual carousel items, including horizontal borders and padding.
    itemMargin: 0,                  //{NEW} Integer: Margin between carousel items.
}); 

将 tjhe itemWidth 更改为容器宽度，即：844px

干杯

Answer 2

首先，将 css-reset 应用到您的站点。

内容（图像）的宽度为 844 像素，但插件计算 li 宽度为 900 像素。这是因为插件可能还会计算浏览器默认应用的 li 的边距/填充。（为了通过 firebug 进行测试，只需删除 900px 宽度。您将获得居中的内容。）

谢谢。