質問編集履歴

1

詳しく書き直しました。

2018/12/08 13:16

投稿

kana0701
kana0701

スコア28

test CHANGED
@@ -1 +1 @@
1
- position abusoluteを使って等間隔に素材を置きたい
1
+ positionを使って等間隔に素材を置きたい
test CHANGED
@@ -5,6 +5,8 @@
5
5
 
6
6
 
7
7
  この画像のように等間に●を置きたいです。
8
+
9
+ グレーの背景の素材自体は900pxで●は250pxです。
8
10
 
9
11
  ### 発生している問題・エラーメッセージ
10
12
 
@@ -16,9 +18,25 @@
16
18
 
17
19
  なぜだか画像がかぶってしまい、どの●も同じ大きさなのに一部の●が大きくなってしまっている。
18
20
 
21
+ left:0%;にしてみたのに左端にくっつかないで中途半端な位置にいます。
22
+
19
23
  ### 該当のソースコード
20
24
 
21
25
  ```css
26
+
27
+ .box{
28
+
29
+ width: 100%;
30
+
31
+ position: relative;
32
+
33
+ margin:auto auto;
34
+
35
+
36
+
37
+ }
38
+
39
+
22
40
 
23
41
  #a{
24
42
 
@@ -86,13 +104,17 @@
86
104
 
87
105
  ```html
88
106
 
107
+   <div class="box">
108
+
109
+ <div class="cf" ><img src=testbg.jpg" alt="" width="100%"></div>
110
+
89
111
  <div class="cf" id="a"><a href="#1"><img src="<test.png" alt="" width="50%"></a></div>
90
112
 
91
113
  <div class="cf" id="b"><a href="#2"><img src="<test.png" alt="" width="50%"></a></div>
92
114
 
93
115
  <div class="cf" id="c"><a href="#3"><img src="<test.png" alt="" width="50%"></a></div>
94
116
 
95
-
117
+ </div>
96
118
 
97
119
  ```
98
120