我正在使用模板在WP上工作,我正在尝试获取一个按钮以在主容器外面浮动。我在这里经历了一些已经发布的问题,但是没有运气。
我尝试使用填充,边距,溢出等。似乎有效的一件事是设置负余量,但是在这种情况下,DIV被主要容器隐藏。
这是HTML:
<div class="purchase_options_meta clearfix">
<div class="purchase_options">
<div id="deal_attributes_wrap" class="section ">
</div>
<div class="buy_button gb_ff font_x_large">
</div>
</div>
</div>
这是我正在使用的CSS:
.container.main {
width: 980px;
padding: 20px;
overflow: visible;
}
.purchase_options {
position: relative;
}
.buy_button {
position: absolute;
background: url(http://topgreekgyms.fitnessforum.gr/wp-content/uploads/2012/12/Button12.png) no-repeat center;
color: white;
height: 100px;
width: 375px;
left: -54px;
top: -16px;
}
.button {
background-color: transparent;
color: #ffffff;
}
.button:hover {
background-color: transparent;
color: #cccccc;
}
.buy_button a {
font-weight: bold;
font-size: 29px;
font-family: arial;
padding: 12px;
display: block;
white-space: nowrap;
position: relative;
margin: 15px 0 0 50px;
}
.buy_button a span {
position: absolute;
right: 33px;
padding: 0 5px;
}
这是指向页面的链接。我的问题是用左侧的顶部红色按钮。
我非常感谢任何帮助!
以防将来帮助某人:
我必须在我的代码中添加CSS的这一部分:
#deal_single.clearfix:after {
clear: both !important;
}
只是更具体的" #deal_single"是页面ID。