Html can'；我的钮扣没有对齐_Html_Css_Alignment

Html can'；我的钮扣没有对齐

html css

Html can'；我的钮扣没有对齐,html,css,alignment,Html,Css,Alignment,我找不到如何水平对齐我的提交按钮。我想将提交按钮对齐到输入字段的右侧。我尝试了几件事，但都不管用这是我的html文件： <body> <form:form class="form" method="post" action="/it-portail/passwordChange.mvc" commandName='email'> <h3>Formulaire email</h3> <form:errors class

我找不到如何水平对齐我的提交按钮。我想将提交按钮对齐到输入字段的右侧。我尝试了几件事，但都不管用

这是我的html文件：

 <body>
<form:form class="form" method="post" action="/it-portail/passwordChange.mvc" commandName='email'>
    <h3>Formulaire email</h3>
    <form:errors class ="errorPass" path="email" />
    <div class="field">
        <form:label path="email">Email:</form:label>
        <form:input class ="input" path="email" />
        <p class="hint">Entrez votre email.</p>
        </div>  
        <input class="button" type="submit" value="VALIDER" />
</form:form>

谢谢，

更改

浮动：无到<代码>浮动：右侧
将此添加到您的.button css中，如下所示
position:absolute;
    right:15px;
    top:145px;

为此，我更新了一些css和html
css
html

公式化电子邮件
电邮：
Entrez votre电子邮件


请检查这是否适用于您
谢谢：）
更改。按钮的css
从
到
演示：
将text align:right添加到您的按钮类中对齐“我的按钮”中的文本更改右侧和顶部的值，然后查看。这应该行啊，这不是我想要的。我想要输入字段下的提交按钮。这个表单是我得到的最简单的表单，但我有一些其他表单，其中包含5+输入字段扫描。请与我们分享一个屏幕截图，你到底喜欢做什么。正如您上面提到的“我想将我的提交按钮与输入字段的右侧对齐”，我想要这样：tinypic.com/view.php？pic=35k60qv&s=5，但提交按钮的右侧与输入字段的右侧对齐。
position:absolute;
    right:15px;
    top:145px;

input {
    font-family: Arial, Verdana;
    font-size: 15px;
    padding: 5px;
    padding-top:5px
    border: 1px solid #b9bdc1;
    width: 150px;
    color: #797979;
    text-align:center;
    float:left;
    margin-right:10px;
}
.field {
    margin-top:4px;
    margin-bot:2px;
}
.button {
    float:left;
    font-weight: bold;
    cursor: pointer;
    color: #fff;
    text-shadow: 0 -1px 1px #64799e;
    /* Background gradient */
    background: #a5b8da;
    background: -moz-linear-gradient(top, #a5b8da 0%, #7089b3 100%);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#a5b8da),
        to(#7089b3));
    /* Border style */
    border: 1px solid #5c6f91;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    /* Box shadow */
    -moz-box-shadow: inset 0 1px 0 0 #aec3e5;
    -webkit-box-shadow: inset 0 1px 0 0 #aec3e5;
    box-shadow: inset 0 1px 0 0 #aec3e5;
}
.label{
    float:left; 
    margin-right:10px;
}
.hint{
    clear:both  
}

<form:form class="form" method="post" action="/it-portail/passwordChange.mvc" commandName='email'>
    <h3>Formulaire email</h3>
    <form:errors class ="errorPass" path="email" />
    <div class="field">
        <form:label path="email" class="label">Email:</form:label>
        <input name="" type="text" class ="input" />
        <input class="button" type="submit" value="VALIDER" />
        <p class="hint">Entrez votre email.</p>
        </div>  
</form:form>

float: none;
margin-top:5px;

float: right;
margin-top:-25px;