jsp 页面中支柱标签的响应式设计页面

Question

我正在尝试创建响应式网页。我试图将三个按钮对齐为响应式按钮。我可以对齐正常的按钮更新和 取消。但是重置按钮无法对齐...它每次都定位在不同的地方。请提供任何帮助吗？

HTML code:
<div class="button-container">
<button type="button" style="opacity:0.5;cursor:default;"  disabled="disabled" title="Update" id="updPsw">
<span>Update</span>
</button>
<button class="mdclose" title="Cancel">Cancel</button>
<s:reset title="Reset"></s:reset>
</div>
CSS:
.button-container{
position: relative;
top :20px;
right: 40px;
}
input[type="reset"] {
padding: 10px 30px 10px 30px;
color: #FFF;
background-color: #444;
font-size: 0.8em;
text-align: center;
font-style: normal;
border-radius: 5px;
/*   width: 100%; */
border: 1px solid #3ac162;
border-width: 1px 1px 3px;
box-shadow: 0 -1px 0 rgba(255, 255, 255, 0.1) inset;
/*  margin-bottom: 10px; */
/*  margin-top: 22px; */
font-family: 'Lato', Calibri, Arial, sans-serif;
cursor: pointer;
position: relative;
bottom: 42px;
right: 62px;
}

Answer 1

不使用 strut 标签，而是使用 html 标签，它解决了

Answer 2

CSS CODE：

.button-container{
position: inherit;
top :20px;
right: 40px;
}
input[type="reset"] {
padding: 10px 30px 10px 30px;
color: #FFF;
background-color: #444;
font-size: 0.8em;
text-align: center;
font-style: normal;
border-radius: 5px;
/*   width: 100%; */
border: 1px solid #3ac162;
border-width: 1px 1px 3px;
box-shadow: 0 -1px 0 rgba(255, 255, 255, 0.1) inset;
/*  margin-bottom: 10px; */
/*  margin-top: 22px; */
font-family: 'Lato', Calibri, Arial, sans-serif;
cursor: pointer;
position: relative;
bottom: 42px;
right: 62px;
}

网页代码 ：

<div class="button-container">
<button type="button"vstyle="opacity:0.5;cursor:default;"  disabled="disabled" title="Update" id="updPsw">
<span>Update</span>
</button>
<button class="mdclose" title="Cancel">Cancel</button>
<button class="mdclose" title="Reset">Reset</button>
</div>