Html 如何在动态可变的div中定位按钮div？

嗨，我创建了一个滑块，我想给滑块一个按钮，应该是这样的

我用下面的代码创建了滑块的按钮

#sliderdiv 
{
    top:30%;     
    right: -2px; 
    position:fixed;
    width:300px;
    height:270px;
    margin-right: -300px;
}
#buttondiv
{                  
    height:110px;
    width:40px;
    background:aqua;
    position:absolute;
    float:left;
    margin-left: -39px;                                     
}

<div id="sliderdiv">
    <div id="buttondiv">
    </div>
</div>

#sliderdiv
{
最高：30%；
右：-2px；
位置：固定；
宽度：300px；
高度：270px；
右边距：-300px；
}
#纽顿迪夫
{                  
高度：110px；
宽度：40px；
背景：水；
位置：绝对位置；
浮动：左；
左边距：-39px；
}

现在，当滑块的宽度改变时，按钮会像这样从滑块移动

我知道这是因为我给按钮div的左边距值。我的问题是，即使滑块div自动更改，是否有方法正确定位它

或者有没有一种方法可以将按钮放置到滑块div，而不留任何间隙，也不更改按钮div值

谢谢

这是小提琴

看看这个：

var mywidth = $("#buttondiv").width();
$("#buttondiv").css("margin-left", -mywidth);

编辑按钮的宽度并点击run

---

如果您更改滑块的val，它将正常工作

好，快一点。我不太理解您的问题，但请查看我用您的代码制作的这个JSFIDLE，并尝试将它与您的问题一起返回，我会看一看。您是否正在使用一些javascript代码来更改（或者幻灯片）该div？您能否在JSFIDLE上创建一个示例？我尝试使用ur css创建，但它不能正常工作（可能是由于ur css中使用的大小）。我尝试在这里重现这个问题：等等，我给你JSFIDLE