Skip to content

Instantly share code, notes, and snippets.

@bcostaaa01

bcostaaa01/index.html

Created September 30, 2020 21:57
Show Gist options
  • Save bcostaaa01/5891a98c116794fdb83605b3d9660d38 to your computer and use it in GitHub Desktop.
Save bcostaaa01/5891a98c116794fdb83605b3d9660d38 to your computer and use it in GitHub Desktop.
Download ZIP
ZEWdzmL
Raw
index.html
<h1 id="title">Best composer survey</h1>
<p id="description">Choose which composer you think is best!<p>
<form id="survey-form">
<div class="row tab">
<div class="label-burger">
<label>Name:</label>
</div>
<div class="input-burger">
<input type="text" placeholder="Name">
</div>
<div class="label-burger">
<label>Age:</label>
</div>
<div class="input-burger">
<input type="number" placeholder="Age">
</div>
<div class="label-burger">
<label>Email:</label>
</div>
<div class="label-burger">
<input type="text" placeholder="Email">
</div>
<div class="row-tab">
<div="label-select">
<label>Choose the composer</label>
<div class="select-input">
<select>
<option value="olafur-arnalds">Olafur Arnalds</option>
<option value="nils-frahm">Nils Frahm</option>
<option value="max-richter">Max Richter</option>
</select>
<div class="row-tab">
<textarea>Leave your final thoughts here</textarea>
</div>
<div class="row-tab">
<input class="button" type="submit">
</div>
Raw
style.css
body {
background-color: #ffef96;
}
h1 {
text-align: center;
}
p {
text-align: center;
font-size: 20px;
}
#survey-form {
width: 500px;
margin: 0 auto;
}
.label-burger {
display: inline-block;
}
.input-burger {
display: inline-block;
}
.row-tab {
display: block;
padding-top: 20px;
}
.label-select {
display: inline-block;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment