我有一个基本的联系表格,但当我试图用CSS自定义它时,它不会自定义,因为我希望表格居中,并且希望姓名,电子邮件和年龄在第一行,主题和选择类别在第二行,大文本框在最后一行,按钮在底部,但是表格由于某种原因无法自定义。 我做错了什么吗?
我尝试过使用float、text-align、margin-left、padding-left和display等多种CSS方法进行调整。我搜索了互联网并寻找了教程,甚至尝试了教程,但依然没有效果。
我的HTML代码如下:
我尝试过使用float、text-align、margin-left、padding-left和display等多种CSS方法进行调整。我搜索了互联网并寻找了教程,甚至尝试了教程,但依然没有效果。
我的HTML代码如下:
<li><button id="mouthoff-button">Mouthoff</button><div id="mouthoff-modal" class="mouthoff-modal"><div class="mouthoff-modal-content"><div class="mouthoff-modal-header"><span class="mouthoff-close">×</span></div><div class="mouthoff-modal-body"><h3>MOUTHOFF - TELL US WHAT'S ON YOUR MIND</h3>
<p>Have something you want to tell us, ask us or bring to our attention? Feel free to Mouthoff and let us know here. Please bear in mind that we may not be able to answer absolutely everything and we won't reveal to you any game info that hasn't yet been announced, but we're always happy to have a look at what you have to say.<br><p>If you have a technical issue that you'd like to report, <a href="#">please contact our Support Team</a>.</p>
<form>
<input type="text" name="name" placeholder="Name">
<input type="email" name="email" placeholder="Email">
<input type="number" name="age" placeholder="Age" min="13" max="100">
<input type="text" name="subject" placeholder="Subject">
<select name="category_id" required="required" id="category-id">
<option value="">Select Category</option>
<option value="1">General Suggestions</option>
</select>
<textarea name="body" class="form-control" rows="4" placeholder="Talk To Us" templates="<div class="form-group col-xxs-12"></div>" oninvalid="setCustomValidity('You need to provide content')" oninput="setCustomValidity('')" maxlength="5000" required="required"></textarea>
<button class="btn btn-yellow" type="submit">SUBMIT</button>
</form>
我的CSS是
.mouthoff-modal-body input[type=text], input[type=email] {
float: right;
margin-left: 150px;
padding-left: 25px;
display: inline-block;
}
我知道这不是很多CSS,但我已经尝试了我所能想到的大部分方法。