HTML-如何让按钮在旁边的按钮被移除后保持在固定位置？

Question

我有两个按钮

<button class="upgradebutton1" id="upupgrade1" onclick="browse_aww()">Browse /r/aww</button> <pr id="priceuno"> 5 </pr> <img id="upvotepicture" width=13px src="http://image.spreadshirt.com/image-server/v1/designs/12018562,width=178,height=178/Upvote-style-arrow.png"></img> 

    <button class="upgradebutton1" id="downupgrade1" onclick="grow_a_neckbeard()">Grow a neckbeard</button> <pr2 id="price2"> 5 </pr2> <img id="downvotepicture" width=13px src="http://wp.iosfans.com/wp-content/uploads/2013/02/Down-vote-arrow-237x250.png"> </img>

每当我单击 browse_aww 按钮时，grow_a_neckbeard 按钮就会滑过第一个按钮原来所在的位置。这是我页面上所有升级按钮的问题。我试过使用 css 将位置设置为 Absolute，但这没有任何作用，而且整个事情都出现了故障。

感谢任何帮助

jsfiddle 链接:http://jsfiddle.net/DayDreamKiddo/zk6F4/7/

Answer 1

如果您将 position 设置为 absolute，您会从正常流中删除该框，因此其他元素的排列就像它从未存在过一样。您应该创建一个相同的框来替换旧框，但我认为简单地禁用该按钮会更容易，或者至少将其 visibility 设置为 hidden (这不会影响正常流量)。