jquery – BXSlider偏离中心的图像

我正在创建一个投资组合网站,但我一直遇到旋转木马问题.我决定尝试使用bxslider,因为我喜欢这种造型,但是现在关于如何让图像在视口中居中,这一直困扰着我.

我已经设法让滑块启动并运行,但我的图像一直显示为偏离中心,好像某处存在一些冲突的CSS.图像是800px乘300px – 我可以通过设置slideWidth：800将框的宽度设置为800px,但这不能解决问题.您可以看到字幕被切断 – 图像向下和向右移动.

请参阅test page – 这是使用未修改的bxslider副本,而不是其他CSS.

任何帮助将不胜感激 – 我确信它很简单,但我仍然对此很新！

解决方法

他们偏离中心是因为你的图像太大了,而且它们是左对齐的,所以它们从父母那里向右延伸.描述你想要的布局,我可以进一步提供帮助.这是一个猜测：

.bx-wrapper img {
    width: 720px;
    height: 230px;
}
.bx-wrapper .bx-caption {
    width: 720px;
}

你也可以这样做：

.bx-wrapper {
    width: 880px;
}
.bx-viewport {
    height: 340px;
}

根据您的评论更新：

.bx-viewport ul {
  margin: 0;
  padding: 0;
}