「Float：right」沒有被應用在提交按鈕上

我想將提交按鈕浮動到窗體中的右側，但是我面臨的問題是浮動未應用於提交按鈕Login。我添加了一些服務器端生成的代碼。「Float：right」沒有被應用在提交按鈕上

代碼

<!DOCTYPE html> 

<head> 
<style type="text/css"> 

    #login-form{ 
    width: 400px; 
    background-color: #6B0000; 
    color: white; 

    } 

    #loginButton{ 
    color: #6B0000; 
    border: 1px solid; 
    padding: 5px 30px 5px 30px; 
    background-color: white; 
    border-radius: 3px; 
    /*This one here does not work */ 
    float: right; 
} 


</style> 

</head> 
<body> 
    <header id="header"> 
     <h1> 
       Google Maps &amp; Yahoo Mashup 

     </h1> 
    </header> 

    <DIV id="content"> 
<form id="login-form" name="login-form" method="post" > 
<input type="hidden" name="login-form" value="login-form" /> 
<table> 
<tbody> 
<tr> 
<td><label>Email</label></td> 
<td><input id="login-form:email" type="text" name="login-form:email" /></td> 
</tr> 
<tr> 
<td><label>Password</label></td> 
<td><input id="login-form:pwd" type="text" name="login-form:pwd" /></td> 
</tr> 
<tr> 
<td><input type="submit" value="Login" id="loginButton" /></td> 
</tr> 
</tbody> 
</table> 
<input type="hidden" name="javax.faces.ViewState" id="j_id1:javax.faces.ViewState:0" /> 
</form> 
    </DIV> 

</body> 
</html>

來源

2016-07-16 Mr Asker

試試這一個。我將一個2的colspan設置爲輸入按鈕，並給它的父級td指定了100％的寬度，這與float right一起將它移到右邊。

#login-form{ 
 
    width: 400px; 
 
    background-color: #6B0000; 
 
    color: white; 
 

 
    } 
 

 
    #loginButton{ 
 
    color: #6B0000; 
 
    border: 1px solid; 
 
    padding: 5px 30px 5px 30px; 
 
    background-color: white; 
 
    border-radius: 3px; 
 
    /*This one here does not work */ 
 
    float: right; 
 
} 
 

 
    /* Make the input's parent td 100%, you may want 
 
    a class here instead for browser support */ 
 
    td:last-child { 
 
    width: 100%; 
 
}

<body> 
 
    <header id="header"> 
 
     <h1> 
 
       Google Maps &amp; Yahoo Mashup 
 

 
     </h1> 
 
    </header> 
 

 
    <DIV id="content"> 
 
<form id="login-form" name="login-form" method="post" > 
 
<input type="hidden" name="login-form" value="login-form" /> 
 
<table> 
 
<tbody> 
 
<tr> 
 
<td><label>Email</label></td> 
 
<td><input id="login-form:email" type="text" name="login-form:email" /></td> 
 
</tr> 
 
<tr> 
 
<td><label>Password</label></td> 
 
<td><input id="login-form:pwd" type="text" name="login-form:pwd" /></td> 
 
</tr> 
 
<tr> 
 
<!-- setting a colspan of two --> 
 
<td colspan="2"><input type="submit" value="Login" id="loginButton" /></td> 
 
</tr> 
 
</tbody> 
 
</table> 
 
<input type="hidden" name="javax.faces.ViewState" id="j_id1:javax.faces.ViewState:0" /> 
 
</form> 
 
    </DIV> 
 

 
</body>

來源

2016-07-16 11:11:31

對我來說，問題是如何設置從JSF的合併單元格值，因爲表，TD和TR標籤由JSF gernerated。 –

你可以嘗試用一些JavaScript覆蓋它可能是這樣的嗎？（'tr：last-child td：last-child'）。setAttribute（「colspan」，2）; –

「Float：right」沒有被應用在提交按鈕上

回答

相關問題