0
创建表单并希望将标签放置在输入文本的左上角。目前通过在标签上放置保证金来实现它的工作 - 但我不认为这是'最佳'解决方案。任何其他方式，而不必使用边距/填充？定位表单标签
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ul,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
body {
line-height:1;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
display:block;
}
nav ul {
list-style:none;
}
blockquote, q {
quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content:'';
content:none;
}
a {
margin:0;
padding:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
/* change colours to suit your needs */
ins {
background-color:#ff9;
color:#000;
text-decoration:none;
}
/* change colours to suit your needs */
mark {
background-color:#ff9;
color:#000;
font-style:italic;
font-weight:bold;
}
del {
text-decoration: line-through;
}
abbr[title], dfn[title] {
border-bottom:1px dotted;
cursor:help;
}
table {
border-collapse:collapse;
border-spacing:0;
}
/* change border colour to suit your needs */
hr {
display:block;
height:1px;
border:0;
border-top:1px solid #cccccc;
margin:1em 0;
padding:0;
}
input, select {
vertical-align:middle;
}
*{
border:none;
}
/* here starts my CSS */
.contact-us{
background-color:#FFB6C1;
clear:left;
text-align:center;
position:relative;
}
.contact-us form{
margin-top:20px;
font-family:'amiri';
border:none;
}
.contact-us form input{
margin-bottom:10px;
}
.contact-us h2{
font-family:'Pacifico',sans-serif;
font-size:30px;
text-align:center;
margin-top:20px;
}
input{
margin:0 auto;
}
input,label{
display:block;
}
label{
margin-right:25%;
}
input[type="text"]{
width:30%;
}
textarea{
width:30%;
height:80px;
}<div class = "contact-us">
\t <div class = "inner-wrapper">
\t \t <h2> Contact </h2>
\t \t
\t \t <form>
\t \t \t <section>
\t \t \t
\t \t \t <label for ="name">Name</label>
\t \t \t \t <input type = "text" name = "name"><br>
\t \t \t <label for ="email">Email</label>
\t \t \t \t <input type ="text" name = "email"><br>
\t \t \t \t
\t \t \t <label for ="message">Message</label>
\t \t \t <textarea name ="message">Enter text here...</textarea>
\t \t \t </section>
\t \t </form>
\t </div>
</div>