質問編集履歴

2

2019/07/23 09:06

投稿

Reem
Reem

スコア27

test CHANGED
File without changes
test CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
 
4
4
 
5
- flexプロパティ使用時に<p>要素と横並びのdiv要素(正方形)を作り、真円を作りたいです。
5
+ flexプロパティ使用時にp要素と横並びのdiv要素(正方形)を作り、真円を作りたいです。
6
6
 
7
7
 
8
8
 

1

画像の追加、再現手順を追記しました。

2019/07/23 09:06

投稿

Reem
Reem

スコア27

test CHANGED
File without changes
test CHANGED
@@ -10,9 +10,19 @@
10
10
 
11
11
  ### 発生している問題
12
12
 
13
+ 下記のコードを実行すると写真左の様になりますが、ウィンドウサイズを小さくすると写真右の様に円が潰れてしまいます。
14
+
15
+ ![下記をコード実行したキャプチャ](1de056b8ecc26965b35bda78e392977d.png)
13
16
 
14
17
 
18
+
19
+ 最終形のイメージとしては円は変形せず、文章のみ変形させたいです。
20
+
21
+ (画像編集ソフトで加工した物なので実際にこうなるかは分かりません)
22
+
15
- `display: flex;`を外すと`<div>`要素は潰れなくなるので `display: flex;`が原因だと思うのですが、解決方法が分かりません。
23
+ ![イメージ説明](1a8b1133ab26d6764df91f8a73482d6d.png)
24
+
25
+
16
26
 
17
27
 
18
28