質問編集履歴

1

このようにtxt-wrapではなくimgが動いてしまいます。

2020/02/07 23:46

投稿

退会済みユーザー
test CHANGED
File without changes
test CHANGED
@@ -1,6 +1,6 @@
1
1
  ```html
2
2
 
3
- <section class="section1">
3
+ <section class="section1">
4
4
 
5
5
  <div class="txt-wrap">
6
6
 
@@ -20,17 +20,21 @@
20
20
 
21
21
  </section>
22
22
 
23
-
24
-
25
23
  ```
26
24
 
27
25
  ```css
28
26
 
27
+
28
+
29
- section1 {
29
+ .section1 {
30
30
 
31
31
  display: flex;
32
32
 
33
- align-items: center
33
+ align-items: center;
34
+
35
+ max-width: 1280px;
36
+
37
+
34
38
 
35
39
  }
36
40
 
@@ -42,9 +46,9 @@
42
46
 
43
47
  background: red;
44
48
 
45
- padding: 60px 0 100px 0;
49
+ padding: 100px 0 150px 0;
46
50
 
47
- /* margin-right: -100px*/
51
+ margin-right: -100px
48
52
 
49
53
  }
50
54
 
@@ -62,37 +66,9 @@
62
66
 
63
67
  z-index: 2;
64
68
 
65
- padding: 40px 20px
69
+ padding: 40px 20px;
66
-
67
- }
68
70
 
69
71
 
70
-
71
- .section1 .txt-wrap h2 {}
72
-
73
-
74
-
75
- .section1 .txt-wrap ul {
76
-
77
- width: 70%;
78
-
79
- margin-left: 30px;
80
-
81
- margin-top: 20px
82
-
83
- }
84
-
85
-
86
-
87
- .section1 .txt-wrap ul li {
88
-
89
- border: 1px solid;
90
-
91
- color: #fff;
92
-
93
- padding: 10px;
94
-
95
- margin: 0 0 0 5px
96
72
 
97
73
  }
98
74
 
@@ -104,21 +80,31 @@
104
80
 
105
81
  position: relative;
106
82
 
107
- z-index: 1;
108
-
109
- margin-left: -100px
110
-
111
-
112
-
113
83
  }
114
84
 
115
85
 
116
86
 
117
87
  .section1 .img .main-img {
118
88
 
119
- width: 105%;
89
+ width: 110%;
120
90
 
121
91
  box-shadow: 0 0 3px #ddd;
92
+
93
+ }
94
+
95
+
96
+
97
+ .section1 .img .sub-img {
98
+
99
+ position: absolute;
100
+
101
+ bottom: 20px;
102
+
103
+ left: -10px;
104
+
105
+ z-index: 2;
106
+
107
+ width: 50%
122
108
 
123
109
  }
124
110