2017-07-03 58 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標籤和它的工作使用主題生成內容