我正在尝试将文本输入与 .formColumn2 的边缘对齐,以便它们都能很好地排列在一起,但我不确定该怎么做。我已经尝试过 margin-right:0 并尝试过 margin-left 但这扩展了我不想要的 .formColumn2 div。如果可能的话,我也想避免 float 。
这是我的代码:
CSS
.bookingForm {
height:450px;
background-color: #D3412A;
}
.bookingForm img {
width:200px;
margin:90px 0 0 170px;
}
form{
padding:20px 0 0 70px;
margin-left: 10%;
color:#fff;
}
.bookingForm .formColumn1,
.bookingForm .formColumn2{
float:left;
}
.bookingForm .formColumn2 {
margin-left: 50px;
}
.bookingForm .formColumn2 input{
margin-right:0;
}
select,input,textarea {
width:200px;
margin:8px 0;
}
最佳答案
您可以设置标签的宽度。
.formColumn2 label {
width: 150px;
display: inline-block;
}
这会将标签设置为固定宽度,使输入对齐。
这里是 the fiddle
关于html - 将文本输入框对齐到 div 的右侧,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23232240/