質問編集履歴
1
画像差し替え
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -6,13 +6,18 @@
|
|
|
6
6
|
|
|
7
7
|
### SVGスプライトの問題点
|
|
8
8
|
SVGスプライトバージョンにおいて、サイズが自動で変わってくれないのが問題です。
|
|
9
|
+
|
|
9
10
|
|
|
10
|
-
|
|
11
|
-
|
|
12
11
|
### 該当のソースコード
|
|
13
|
-
比較サンプル → https://jsfiddle.net/
|
|
12
|
+
比較サンプル → https://jsfiddle.net/zn7ctop9/
|
|
14
13
|
|
|
15
14
|
```html
|
|
15
|
+
<!-- 問題点の説明 -->
|
|
16
|
+
<p>上（べた打ちバージョン）<br>
|
|
17
|
+
親要素(.left) の width に応じて、<span class="red">SVGのheight</span>が自動で変わってくれる</p>
|
|
18
|
+
<p>下（SVGスプライトバージョン）<br>
|
|
19
|
+
<span class="red">SVGのheight</span>が自動で変わってくれない</p>
|
|
20
|
+
|
|
16
21
|
<!-- ベタ打ちバージョン -->
|
|
17
22
|
<div class="flex">
|
|
18
23
|
<div class="left">
|
|
@@ -43,11 +48,6 @@
|
|
|
43
48
|
</div>
|
|
44
49
|
</div>
|
|
45
50
|
|
|
46
|
-
<!-- 問題点の説明 -->
|
|
47
|
-
<p>下（べた打ちバージョン）<br>
|
|
48
|
-
親要素(.left) の width に応じて、<span class="red">SVGのheight</span>が自動で変わってくれる</p>
|
|
49
|
-
<p>上（SVGスプライトバージョン）<br>
|
|
50
|
-
<span class="red">SVGのheight</span>が自動で変わってくれない</p>
|
|
51
51
|
```
|
|
52
52
|
```css
|
|
53
53
|
.flex {
|