我的JSPX中有以下行
<div class="page_nav">
<a id="saveButton" class="button"><span>${save}</span></a>
<a id="cancelButton" class="button"><span>${cancel}</span></a>
</div>
用于加载“保存”和“取消”按钮。当我加载页面时,按钮的顺序没有订购,仅在chrome中。请参考屏幕截图以供参考
以下是来自css的复制粘贴
a.button {
background: transparent
url('../../images/admin/bg_button_span.png') repeat
scroll top right;
color: #fff;
display: block;
float: left;
font: normal 1.1em Tahoma, Arial;
height: 24px;
margin-right: 6px;
padding-right: 10px;
padding-left: 10px;
text-decoration: none;
cursor: pointer;
}
.page_nav {
float: left;
margin: 1em 0;
width: 100%;
clear: both;
}
仅在Chrome
中发生我在另一个页面中使用相同的div(同样的类名)。它在那里完美地工作。不确定这里缺少什么
请帮我解决这个问题
答案 0 :(得分:3)
尝试设置overflow:hidden for .page_nav:
.page_nav {
float: left;
display:block;
margin: 1em 0;
width: 100%;
overflow: hidden;
}