質問編集履歴

6

2017/06/16 01:53

投稿

Spin
Spin

スコア13

test CHANGED
File without changes
test CHANGED
@@ -8,11 +8,7 @@
8
8
 
9
9
 
10
10
 
11
- タブや開閉式のスポイラーの中に入れたテーブルを表示が崩れないモバイル表示にしたい。![イメージ説明](4c3df9b49e9f49c418d308e2391d4187.png)
11
+ タブや開閉式のスポイラーの中に入れたテーブルを表示が崩れないモバイル表示にしたい。!
12
-
13
-
14
-
15
- 上記のような状態にしたい
16
12
 
17
13
 
18
14
 
@@ -22,21 +18,11 @@
22
18
 
23
19
  スポイラーの中にいれたテーブルのモバイル表示が崩れる。
24
20
 
25
- (スポイラーの中にあるコンテンツがモバイルで表示されているのにモバイルという認識をおこなっていない気がします。)![イメージ説明](20d32a921a88e42425a7479f2b64271e.png)
21
+ (スポイラーの中にあるコンテンツがモバイルで表示されているのにモバイルという認識をおこなっていない気がします。)
26
22
 
27
23
 
28
24
 
29
- 該当のソースコード
30
25
 
31
-
32
-
33
- [su_tabs class="artabs"]
34
-
35
- [su_tab title="タイタン防具"] [su_spoiler title="ヘルメット" style="fancy" open="yes"] [table id=11 /] [/su_spoiler] [su_spoiler title="ガントレット" style="fancy" open="no"] [table id=1 /] [/su_spoiler] [su_spoiler title="チェストアーマー" style="fancy" open="no"] [table id=10 /] [/su_spoiler] [su_spoiler title="レッグアーマー" style="fancy" open="no"] テーブル入れる [/su_spoiler] [su_spoiler title="クラスアーマー" style="fancy" open="no"] テーブル入れる [/su_spoiler] [/su_tab]
36
-
37
-
38
-
39
- 試したこと
40
26
 
41
27
 
42
28
 
@@ -67,27 +53,3 @@
67
53
  プラグインの変更やコードなどで実現できれば手段は何でも構いません。
68
54
 
69
55
  全くの素人なのでわらにもすがる思いです。助言をいただけますと幸いです。
70
-
71
-
72
-
73
-
74
-
75
-
76
-
77
- 6月9日追記
78
-
79
- ![footable設定画面](1103549b52165052b2d19750aa1dbd2c.png)![footable設定画面](403e9f0c68f66ab0e3392a9728dcbace.png)![tablepress設定画面](31f3edb23957d70009740f5844a2ad0f.png)
80
-
81
-
82
-
83
- プラグインの設定のSSになります。
84
-
85
-
86
-
87
- 6月10日追記
88
-
89
- TablePress Extension: Responsive Tablesを導入後のSS
90
-
91
- ![イメージ説明](f1d2a28abeb04dfcc52ca3c98e9f547a.png)
92
-
93
- [table id=123 responsive="all" /]と記述するとずれてしまいました。

5

追記

2017/06/16 01:53

投稿

Spin
Spin

スコア13

test CHANGED
File without changes
test CHANGED
@@ -81,3 +81,13 @@
81
81
 
82
82
 
83
83
  プラグインの設定のSSになります。
84
+
85
+
86
+
87
+ 6月10日追記
88
+
89
+ TablePress Extension: Responsive Tablesを導入後のSS
90
+
91
+ ![イメージ説明](f1d2a28abeb04dfcc52ca3c98e9f547a.png)
92
+
93
+ [table id=123 responsive="all" /]と記述するとずれてしまいました。

4

設定の画像を追加しました。

2017/06/10 05:13

投稿

Spin
Spin

スコア13

test CHANGED
File without changes
test CHANGED
@@ -67,3 +67,17 @@
67
67
  プラグインの変更やコードなどで実現できれば手段は何でも構いません。
68
68
 
69
69
  全くの素人なのでわらにもすがる思いです。助言をいただけますと幸いです。
70
+
71
+
72
+
73
+
74
+
75
+
76
+
77
+ 6月9日追記
78
+
79
+ ![footable設定画面](1103549b52165052b2d19750aa1dbd2c.png)![footable設定画面](403e9f0c68f66ab0e3392a9728dcbace.png)![tablepress設定画面](31f3edb23957d70009740f5844a2ad0f.png)
80
+
81
+
82
+
83
+ プラグインの設定のSSになります。

3

画像入れました。

2017/06/09 08:03

投稿

Spin
Spin

スコア13

test CHANGED
File without changes
test CHANGED
@@ -8,9 +8,9 @@
8
8
 
9
9
 
10
10
 
11
- タブや開閉式のスポイラーの中に入れたテーブルを表示が崩れないモバイル表示にしたい。
11
+ タブや開閉式のスポイラーの中に入れたテーブルを表示が崩れないモバイル表示にしたい。![イメージ説明](4c3df9b49e9f49c418d308e2391d4187.png)
12
12
 
13
- !![イメージ説明](ec2b2cd6831cc0167de7cb5d1579bbf6.png)記のよ](1185531ec332345599554ada36faa917.png)](4dd508ced7aa5f4cb9c6ae99e235afab.png)
13
+
14
14
 
15
15
  上記のような状態にしたい
16
16
 
@@ -22,13 +22,9 @@
22
22
 
23
23
  スポイラーの中にいれたテーブルのモバイル表示が崩れる。
24
24
 
25
- (スポイラーの中にあるコンテンツがモバイルで表示されているのにモバイルという認識をおこなっていない気がします。)
25
+ (スポイラーの中にあるコンテンツがモバイルで表示されているのにモバイルという認識をおこなっていない気がします。)![イメージ説明](20d32a921a88e42425a7479f2b64271e.png)
26
-
27
- ![
28
26
 
29
27
 
30
-
31
- ](feb81ea73c2414233cb2663c7e998f8c.png)
32
28
 
33
29
  該当のソースコード
34
30
 

2

丸投げの質問ではないので情報を追記しました。

2017/06/08 05:58

投稿

Spin
Spin

スコア13

test CHANGED
File without changes
test CHANGED
@@ -8,7 +8,9 @@
8
8
 
9
9
 
10
10
 
11
- タブや開閉式のスポイラーの中に入れたテーブルを表示が崩れないモバイル表示にしたい。イメージ説明
11
+ タブや開閉式のスポイラーの中に入れたテーブルを表示が崩れないモバイル表示にしたい。
12
+
13
+ !![イメージ説明](ec2b2cd6831cc0167de7cb5d1579bbf6.png)記のよ](1185531ec332345599554ada36faa917.png)](4dd508ced7aa5f4cb9c6ae99e235afab.png)
12
14
 
13
15
  上記のような状態にしたい
14
16
 
@@ -22,9 +24,11 @@
22
24
 
23
25
  (スポイラーの中にあるコンテンツがモバイルで表示されているのにモバイルという認識をおこなっていない気がします。)
24
26
 
25
- イメージ説明
27
+ ![
26
28
 
27
29
 
30
+
31
+ ](feb81ea73c2414233cb2663c7e998f8c.png)
28
32
 
29
33
  該当のソースコード
30
34
 

1

情報が足りないので追記

2017/06/08 05:57

投稿

Spin
Spin

スコア13

test CHANGED
File without changes
test CHANGED
@@ -1,3 +1,69 @@
1
1
  ワードプレスでスポイラーの中にテーブルを作成したところモバイル端末での表示が崩れてしまいました。
2
2
 
3
3
  スポイラーの中にあるテーブルにモバイルで表示されていることを認識させるためにはどうすればよいですか?
4
+
5
+
6
+
7
+ 前提・実現したいこと
8
+
9
+
10
+
11
+ タブや開閉式のスポイラーの中に入れたテーブルを表示が崩れないモバイル表示にしたい。イメージ説明
12
+
13
+ 上記のような状態にしたい
14
+
15
+
16
+
17
+ 発生している問題・エラーメッセージ
18
+
19
+
20
+
21
+ スポイラーの中にいれたテーブルのモバイル表示が崩れる。
22
+
23
+ (スポイラーの中にあるコンテンツがモバイルで表示されているのにモバイルという認識をおこなっていない気がします。)
24
+
25
+ イメージ説明
26
+
27
+
28
+
29
+ 該当のソースコード
30
+
31
+
32
+
33
+ [su_tabs class="artabs"]
34
+
35
+ [su_tab title="タイタン防具"] [su_spoiler title="ヘルメット" style="fancy" open="yes"] [table id=11 /] [/su_spoiler] [su_spoiler title="ガントレット" style="fancy" open="no"] [table id=1 /] [/su_spoiler] [su_spoiler title="チェストアーマー" style="fancy" open="no"] [table id=10 /] [/su_spoiler] [su_spoiler title="レッグアーマー" style="fancy" open="no"] テーブル入れる [/su_spoiler] [su_spoiler title="クラスアーマー" style="fancy" open="no"] テーブル入れる [/su_spoiler] [/su_tab]
36
+
37
+
38
+
39
+ 試したこと
40
+
41
+
42
+
43
+ PCでは画面を小さくしても正常にレスポンシブで表示される。
44
+
45
+ タブやスポイラーの中にテーブルを入れているが、テーブルのみ、タブの中にテーブルを入れたときも正常に表示される。
46
+
47
+ スポイラーの中にはいっているテーブルがアイフォンなどの端末で見たときのみ表示が崩れる。
48
+
49
+ アイフォンで表示崩れが起きている画面を横や縦向きにして元に戻すと表示崩れが解消され正常に表示される。
50
+
51
+
52
+
53
+ 補足情報(言語/FW/ツール等のバージョンなど)
54
+
55
+
56
+
57
+ ワードプレスのプラグインを使用してます。
58
+
59
+ TablePress(テーブル作成プラグイン)
60
+
61
+ FooTable(モバイル判定がでるとテーブルを一部折りたたみ見やすくしてくれるプラグイン)
62
+
63
+ Shortcodes Ultimate(タブやトグルをショートコードで簡単に設定できるプラグイン)
64
+
65
+
66
+
67
+ プラグインの変更やコードなどで実現できれば手段は何でも構いません。
68
+
69
+ 全くの素人なのでわらにもすがる思いです。助言をいただけますと幸いです。