Jquery 如何正确地向bxSlider中的元素添加边距

目标：有一个能够滑动div的滑块，元素之间必须有间隙

问题：我有6张幻灯片（div），它们应该是这样的：（这不是一个非常准确的例子，因为左侧幻灯片中的图像被剪切了大约15个像素。但我希望它能给出需要实现的想法。）

我使用bxslider网站示例页面中的代码：

$(function(){
 $('#slider1').bxSlider({
displaySlideQty: 3,
moveSlideQty: 1,
prevText: "",
prevSelector: '#backar',
prevImage: '/img/siteicons/slider-left-arrow.png',
nextText: "",
nextSelector: '#forwar',
nextImage: '/img/siteicons/slider-right-arrow.png'
 });
});

正如我所说，幻灯片的元素之间需要有一个间隙，所以我添加了右边的边距：20px；到.元素 但是结果很奇怪。。。 现在元素之间有一个间隙，但是元素本身在旋转几圈后无法正确显示。（例如：）

所以我的问题是：如何正确地在滑块中的元素中添加边距/填充（无论什么）？我不确定这个问题是否与CSS或JS有关，但我希望有人知道解决方案

我尝试了不同的边距/填充，我还尝试添加固定的数字，而不是getWrapperWidth（）；在bxSlider代码中设置为wrapperWidth=。但是没有运气

---

我的测试页面：

问题在于，滑块工具使用.element div的宽度来确定单击箭头时要滑动的距离。换句话说，去掉.element div右边的边距

.element {
    float: left;
    max-height: 210px;
    max-width: 210px;
    width: 210px;
}

并在图像中添加填充

img {
    border: 0 none;
    padding-right: 10px;
}

---

我想只要稍加摆弄，你就能看到你想要的样子。

没有边距，没有填充物。您希望在bxSlider中的元素之间有一个间隙–为DIV/li（您的“滑动元素”）添加额外的宽度，等等

就我而言

.element{
float: left;
width: 225px;
max-width: 225px;
max-height: 210px;
}

---

顺便说一句，我还在slider js中将fixed width设置为wrapperWidth

谢谢你的回答，但我发现了更简单的方法来实现我的需要–为.element添加额外的宽度