Skip to content

Commit 7640bc5

Browse files
rohan-arunkumarrohan-arunkumar
authored
Create style.css
1 parent d6c8967 commit 7640bc5

File tree

1 file changed

+143
-0
lines changed

1 file changed

+143
-0
lines changed

‎module2-solution/css/style.css

+143
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,143 @@
1+
* {
2+
box-sizing: border-box;
3+
}
4+
5+
@media (min-width:992px) {
6+
body {
7+
font-family: Arial,Helvetica,sans-serif;
8+
font-weight: bold;
9+
font-size: 100%;
10+
margin: 0px;
11+
}
12+
13+
h1 {
14+
font-size: 3em;
15+
text-align: center;
16+
}
17+
18+
.box {
19+
width: 31.5%;
20+
border: 2px solid black;
21+
margin: 10px;
22+
background-color: #A9A9A9;
23+
float: left;
24+
}
25+
#color1 {
26+
background-color: #FFB6C1
27+
}
28+
#color2 {
29+
background-color: #FF6347
30+
}
31+
#color3 {
32+
background-color: #FFFF00
33+
}
34+
.labeltext {
35+
width: 45%;
36+
float: right;
37+
text-align: center;
38+
border: 2px solid black;
39+
clear: both;
40+
font-size: 2em;
41+
margin-bottom: 20px;
42+
}
43+
.content {
44+
clear: both;
45+
padding: 10px;
46+
}}
47+
48+
@media (min-width:768px) and (max-width:991px) {
49+
body {
50+
font-family: Arial,Helvetica,sans-serif;
51+
font-weight: bold;
52+
font-size: 100%;
53+
margin: 0px;
54+
}
55+
h1 {
56+
font-size: 3em;
57+
text-align: center;
58+
}
59+
#chicken {
60+
width: 47.5%;
61+
border: 2px solid black;
62+
margin: 10px;
63+
background-color: #A9A9A9;
64+
float: left;
65+
}
66+
#beef {
67+
width: 47.5%;
68+
border: 2px solid black;
69+
margin: 10px;
70+
background-color: #A9A9A9;
71+
float: left;
72+
}
73+
#sushi {
74+
width: 98%;
75+
border: 2px solid black;
76+
margin: 10px;
77+
background-color: #A9A9A9;
78+
float: left;
79+
}
80+
81+
#color1 {
82+
background-color: #FFB6C1
83+
}
84+
#color2 {
85+
background-color: #FF6347
86+
}
87+
#color3 {
88+
background-color: #FFFF99
89+
}
90+
.labeltext {
91+
width: 45%;
92+
float: right;
93+
text-align: center;
94+
border: 2px solid black;
95+
clear: both;
96+
font-size: 2em;
97+
margin-bottom: 20px;
98+
}
99+
.content {
100+
clear: both;
101+
padding: 10px;
102+
} }
103+
104+
@media (max-width:767px) {
105+
body {
106+
font-family: Arial,Helvetica,sans-serif;
107+
font-weight: bold;
108+
font-size: 100%;
109+
margin: 0px;
110+
}
111+
h1 {
112+
font-size: 3em;
113+
text-align: center;
114+
}
115+
.box {
116+
width: 98%;
117+
border: 2px solid black;
118+
margin: 10px;
119+
background-color: #A9A9A9;
120+
float: left;
121+
}
122+
#color1 {
123+
background-color: #FFB6C1
124+
}
125+
#color2 {
126+
background-color: #FF6347
127+
}
128+
#color3 {
129+
background-color: #FFFF99
130+
}
131+
.labeltext {
132+
width: 45%;
133+
float: right;
134+
text-align: center;
135+
border: 2px solid black;
136+
clear: both;
137+
font-size: 2em;
138+
margin-bottom: 20px;
139+
}
140+
.content {
141+
clear: both;
142+
padding: 10px;
143+
}}

0 commit comments

Comments
 (0)