Skip to content

Commit 96a0f09

Browse files
committed
style css
1 parent 1e75e19 commit 96a0f09

2 files changed

Lines changed: 101 additions & 0 deletions

File tree

Form-Controls/index.html

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@
66
<title>T-Shirt Order Form</title>
77
<meta name="description" content="T-shirt order form" />
88
<meta name="viewport" content="width=device-width, initial-scale=1" />
9+
10+
<link rel="stylesheet" href="style.css" />
911
</head>
1012
<body>
1113
<header>

Form-Controls/style.css

Lines changed: 99 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,99 @@
1+
/* Reset some default styles */
2+
* {
3+
box-sizing: border-box;
4+
margin: 0;
5+
padding: 0;
6+
font-family: Arial, Helvetica, sans-serif;
7+
}
8+
9+
/* Page layout */
10+
body {
11+
background-color: #f7f7f7;
12+
color: #333;
13+
line-height: 1.5;
14+
padding: 20px;
15+
}
16+
17+
/* Center content */
18+
main {
19+
max-width: 500px;
20+
margin: 40px auto;
21+
background: #ffffff;
22+
padding: 25px;
23+
border-radius: 8px;
24+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
25+
}
26+
27+
/* Header */
28+
header h1 {
29+
text-align: center;
30+
margin-bottom: 20px;
31+
font-weight: 500;
32+
}
33+
34+
/* Form spacing */
35+
form div,
36+
fieldset {
37+
margin-bottom: 15px;
38+
}
39+
40+
/* Labels */
41+
label {
42+
display: block;
43+
margin-bottom: 5px;
44+
font-size: 0.9rem;
45+
}
46+
47+
/* Inputs and select */
48+
input,
49+
select {
50+
width: 100%;
51+
padding: 8px 10px;
52+
border: 1px solid #ccc;
53+
border-radius: 5px;
54+
font-size: 0.95rem;
55+
}
56+
57+
/* Radio buttons inline */
58+
fieldset label {
59+
display: inline-flex;
60+
align-items: center;
61+
margin-right: 15px;
62+
font-size: 0.9rem;
63+
}
64+
65+
fieldset input {
66+
margin-right: 5px;
67+
}
68+
69+
/* Fieldset styling */
70+
fieldset {
71+
border: 1px solid #ddd;
72+
padding: 10px;
73+
border-radius: 5px;
74+
}
75+
76+
/* Button */
77+
button {
78+
width: 100%;
79+
padding: 10px;
80+
border: none;
81+
background-color: #333;
82+
color: #fff;
83+
font-size: 1rem;
84+
border-radius: 5px;
85+
cursor: pointer;
86+
}
87+
88+
/* Button hover */
89+
button:hover {
90+
background-color: #555;
91+
}
92+
93+
/* Footer */
94+
footer {
95+
text-align: center;
96+
margin-top: 20px;
97+
font-size: 0.8rem;
98+
color: #777;
99+
}

0 commit comments

Comments
 (0)