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>