Skip to content

Commit 9a5ecd7

Browse files
chrisdavidmillschrisdavidmills
committed
updating sizing on flexbox examples
1 parent 20316ee commit 9a5ecd7

7 files changed

+78
-16
lines changed

‎flexbox/basics/align-items.html

+11-2
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,8 @@
1313
}
1414

1515
textarea {
16-
height: 160px;
16+
display: block;
17+
margin-bottom: 10px;
1718
background-color: #F4F7F8;
1819
border: none;
1920
border-left: 6px solid #558ABB;
@@ -24,6 +25,14 @@
2425
font-size: 90%;
2526
}
2627

28+
textarea:nth-of-type(1) {
29+
height: 80px
30+
}
31+
32+
textarea:nth-of-type(2) {
33+
height: 160px
34+
}
35+
2736
.playable-buttons {
2837
text-align: right;
2938
width: 90%;
@@ -125,4 +134,4 @@
125134
window.addEventListener('load', fillCode);
126135
</script>
127136

128-
</html>
137+
</html>

‎flexbox/basics/flex-direction.html

+12-5
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33

44
<head>
55
<meta charset="utf-8">
6-
<title>Flexbox Basics: The flex-directio property</title>
6+
<title>Flexbox Basics: The flex-direction property</title>
77

88
<style>
99
body {
@@ -13,7 +13,8 @@
1313
}
1414

1515
textarea {
16-
height: 80px;
16+
display: block;
17+
margin-bottom: 10px;
1718
background-color: #F4F7F8;
1819
border: none;
1920
border-left: 6px solid #558ABB;
@@ -24,6 +25,14 @@
2425
font-size: 90%;
2526
}
2627

28+
textarea:nth-of-type(1) {
29+
height: 80px
30+
}
31+
32+
textarea:nth-of-type(2) {
33+
height: 90px
34+
}
35+
2736
.playable-buttons {
2837
text-align: right;
2938
width: 90%;
@@ -46,8 +55,6 @@
4655
margin: 5px;
4756
}
4857

49-
50-
5158
.box>* {
5259
border: 2px solid rgb(96, 139, 168);
5360
border-radius: 5px;
@@ -118,4 +125,4 @@
118125
window.addEventListener('load', fillCode);
119126
</script>
120127

121-
</html>
128+
</html>

‎flexbox/basics/flex-flow.html

+11-2
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,8 @@
1313
}
1414

1515
textarea {
16-
height: 80px;
16+
display: block;
17+
margin-bottom: 10px;
1718
background-color: #F4F7F8;
1819
border: none;
1920
border-left: 6px solid #558ABB;
@@ -24,6 +25,14 @@
2425
font-size: 90%;
2526
}
2627

28+
textarea:nth-of-type(1) {
29+
height: 80px
30+
}
31+
32+
textarea:nth-of-type(2) {
33+
height: 90px
34+
}
35+
2736
.playable-buttons {
2837
text-align: right;
2938
width: 90%;
@@ -116,4 +125,4 @@
116125
window.addEventListener('load', fillCode);
117126
</script>
118127

119-
</html>
128+
</html>

‎flexbox/basics/flex-properties.html

+11-2
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,8 @@
1313
}
1414

1515
textarea {
16-
height: 160px;
16+
display: block;
17+
margin-bottom: 10px;
1718
background-color: #F4F7F8;
1819
border: none;
1920
border-left: 6px solid #558ABB;
@@ -24,6 +25,14 @@
2425
font-size: 90%;
2526
}
2627

28+
textarea:nth-of-type(1) {
29+
height: 120px
30+
}
31+
32+
textarea:nth-of-type(2) {
33+
height: 90px
34+
}
35+
2736
.playable-buttons {
2837
text-align: right;
2938
width: 90%;
@@ -114,4 +123,4 @@
114123
window.addEventListener('load', fillCode);
115124
</script>
116125

117-
</html>
126+
</html>

‎flexbox/basics/flex-wrap.html

+11-2
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,8 @@
1313
}
1414

1515
textarea {
16-
height: 80px;
16+
display: block;
17+
margin-bottom: 10px;
1718
background-color: #F4F7F8;
1819
border: none;
1920
border-left: 6px solid #558ABB;
@@ -24,6 +25,14 @@
2425
font-size: 90%;
2526
}
2627

28+
textarea:nth-of-type(1) {
29+
height: 80px
30+
}
31+
32+
textarea:nth-of-type(2) {
33+
height: 90px
34+
}
35+
2736
.playable-buttons {
2837
text-align: right;
2938
width: 90%;
@@ -117,4 +126,4 @@
117126
window.addEventListener('load', fillCode);
118127
</script>
119128

120-
</html>
129+
</html>

‎flexbox/basics/justify-content.html

+11-2
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,8 @@
1313
}
1414

1515
textarea {
16-
height: 100px;
16+
display: block;
17+
margin-bottom: 10px;
1718
background-color: #F4F7F8;
1819
border: none;
1920
border-left: 6px solid #558ABB;
@@ -24,6 +25,14 @@
2425
font-size: 90%;
2526
}
2627

28+
textarea:nth-of-type(1) {
29+
height: 80px
30+
}
31+
32+
textarea:nth-of-type(2) {
33+
height: 90px
34+
}
35+
2736
.playable-buttons {
2837
text-align: right;
2938
width: 90%;
@@ -116,4 +125,4 @@
116125
window.addEventListener('load', fillCode);
117126
</script>
118127

119-
</html>
128+
</html>

‎flexbox/basics/the-flex-container.html

+11-1
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,8 @@
1313
}
1414

1515
textarea {
16+
display: block;
17+
margin-bottom: 10px;
1618
height: 160px;
1719
background-color: #F4F7F8;
1820
border: none;
@@ -24,6 +26,14 @@
2426
font-size: 90%;
2527
}
2628

29+
textarea:nth-of-type(1) {
30+
height: 80px
31+
}
32+
33+
textarea:nth-of-type(2) {
34+
height: 160px
35+
}
36+
2737
.playable-buttons {
2838
text-align: right;
2939
width: 90%;
@@ -122,4 +132,4 @@
122132
window.addEventListener('load', fillCode);
123133
</script>
124134

125-
</html>
135+
</html>

0 commit comments

Comments
 (0)