Skip to content

Commit 5955544

Browse files
committed
added css
1 parent 21f4714 commit 5955544

2 files changed

Lines changed: 45 additions & 3 deletions

File tree

Form-Controls/index.html

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
<meta charset="utf-8" />
55
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
66
<title>My form exercise</title>
7+
<link rel="stylesheet" href="style.css" />
78
<meta name="description" content="" />
89
<meta name="viewport" content="width=device-width, initial-scale=1" />
910
</head>
@@ -77,9 +78,9 @@ <h1>Product Pick</h1>
7778
</div>
7879
</fieldset>
7980
<!-- submit and reset added -->
80-
<div>
81-
<button type="submit">Submit</button>
82-
<button type="reset">Clear form</button>
81+
<div class="buttons">
82+
<button class="submit-btn" type="submit">Submit</button>
83+
<button class="reset-btn" type="reset">Clear form</button>
8384
</div>
8485
</form>
8586
</main>

Form-Controls/style.css

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
body {
2+
font-family: Arial, Helvetica, sans-serif;
3+
line-height: 1.5;
4+
margin: 2rem;
5+
}
6+
7+
form {
8+
max-width: 400px;
9+
margin: 0 auto;
10+
}
11+
12+
13+
div {
14+
margin-bottom: 1rem;
15+
}
16+
17+
18+
label {
19+
display: inline-block;
20+
width: 120px;
21+
}
22+
23+
button {
24+
padding: 0.5rem 1rem;
25+
border-radius: 5px;
26+
}
27+
28+
.submit-btn {
29+
background-color: #4CAF50;
30+
}
31+
32+
.reset-btn{
33+
background-color: #FFD8A8;
34+
color: black;
35+
}
36+
37+
.buttons{
38+
text-align: center;
39+
margin-top: 1.5rem;
40+
}
41+

0 commit comments

Comments
 (0)