标签，文本区域和按钮位置不正确

我正在尝试调整我的代码，以便沿着右侧的textarea和底部的按钮居中放置反馈标签。我不能让他们正确对齐，并与它挣扎了一段时间，现在需要一些帮助：标签，文本区域和按钮位置不正确

HTML

<div class = "formBkg"> 
<br></br> 
<label class = "lbl">First Name: <b class = "red">*</b></label><input class = "inp" type = "text" name = "fName" placeholder = "Adam"> 
<label class = "form">Feedback about the site: <b class = "red">*</b></label> 
<textarea class = "area"rows = "5" cols = "50" name = "feedback" placeholder="Enter your comments..."></textarea> 


<p><label class = "lbl">Surname: </label><input class = "inp" type = "text" name = "sName" placeholder = "Richardson"></p> 
<p><label class = "lbl">Email: </label><input class = "inp" type = "email" name = "eMail" placeholder = "[email protected].com"></p> 

<p><label class = "lbl">Rate the website: <b class = "red">*</b></label></p> 
<input type = "radio" name = "rating" value = "terrible"> Terrible 
<input type = "radio" name = "rating" value = "poor"> Poor 
<input type = "radio" name = "rating" value = "adequate"> Adequate 
<input type = "radio" name = "rating" value = "good"> Good 
<input type = "radio" name = "rating" value = "excellent"> Excellent 
<p><input type = "button" name = "input" value = "Submit" class = "btn"></p> 
</div> 

</form>

CSS

.red{ 
    color: #ff0000; 
} 
.inp{ 
    padding: 5px 0 5px 5px; 
} 

.lbl{ 
    padding: 0 20px 0 150px; 
    padding-right:20px; 
    font-weight: bold; 
    font-size: 20px; 
    width: 220px; 
    float:left; 
} 
.formBkg{ 
    background-color: #696969; 
    color: #ffffff; 
    padding: 20px 0 20px 0; 
} 
.form{ 
    padding: 0 700px 0 20px; 
    font-weight: bold; 
    font-size: 20px; 
    width: 220px; 
    float:right; 
} 
.area{ 
    float:center; 
} 

.btn{ 
    text-align: center; 
}

来源

2016-03-30 qudz

你能张贴你的目标什么，你在说什么的screeshot？ – BHouwens

http://tinypic.com/r/2uz4d5g/9对不起，我在外面工作，我的设备搞乱了......但这大致是这个想法... – qudz

一套高度<textarea>和同一行 - 高至<label>

CSS

.area{ 
    height:100px; 
} 
.form{ 
    line-height:100px; 
}

这将垂直对齐的标签中心

来源

2016-03-30 20:21:09

标签，文本区域和按钮位置不正确

回答

相关问题