2017-07-03 106 views
0

我正在尝试创建响应式网页。我试图将三个按钮对齐为一个响应式按钮。我可以对齐正常的按钮更新和 cancel.But复位按钮不能对齐...它是每次定位在不同的地方。有任何帮助吗?jsp页面中struts标签的响应式设计页面

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; 
} 
+0

Struts中,你需要什么? –

+0

为S2标签使用不同的主题或使用HTML标签。 –

回答

-1

CSS代码:

.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; 
} 

HTML代码:

<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> 
+0

您可以在代码中添加注释或小解释,以便了解您在答案中所做的操作:) –

+0

Reset是struts标签按钮,他们在onclick上调用一些与struts相关的东西 – Raja

0

而不是使用撑杆标签,使用HTML标签和它的工作使用主题生成内容