質問編集履歴

1

情報の修正

2020/12/28 13:15

投稿

退会済みユーザー
test CHANGED
@@ -1 +1 @@
1
- Markdown技法記述したコードがスマートフォンで表示した時に勝手に改行されてしまう問題を解決したい。
1
+ Python-MarkdownでHTMLに変換したコードがスマートフォンで表示した時に勝手に改行されてしまう問題を解決したい。
test CHANGED
@@ -1,21 +1,79 @@
1
- Markdownで以下のようコード記述しました。
1
+ DjangoでMarkdownで入力したテキストをテンプレートでHTML変換できるサンプルアプリ作成しました。
2
+
3
+ マークダウンからHTMLに変換する際のライブラリは以下のものを利用しています。
2
4
 
3
5
 
4
6
 
5
- ```html
7
+ [Python-Markdown](https://python-markdown.github.io/)
6
8
 
9
+
10
+
11
+ templatetagsにフィルタを自作し、テンプレートで文字を出力する際にHTMLに変換しています。
12
+
13
+
14
+
15
+ ```python
16
+
17
+ from django import template
18
+
7
- <meta name="viewport" content="width=device-width, initial-scale=1">
19
+ from django.template.defaultfilters import stringfilter
20
+
21
+ import markdown
22
+
23
+
24
+
25
+ register = template.Library()
26
+
27
+
28
+
29
+ @register.filter
30
+
31
+ @stringfilter
32
+
33
+ def markdown(value):
34
+
35
+ return markdown.markdown(value)
8
36
 
9
37
  ```
10
38
 
11
39
 
12
40
 
41
+ テンプレート
42
+
43
+ ```python
44
+
45
+ {{ text | markdown | safe }}
46
+
47
+ ```
48
+
13
- パソコンではスクロールバーが表示され改行されず表示されてまうですが、スマートフォンは何故か勝手改行されスクロールバーが表示されせん
49
+ 例えば以下のよう```文字列```と入力たもをテンプレートでHTML変換し出力したとし
50
+
51
+ ```python
52
+
53
+ from django.views.generic import ListView, DetailView, CreateView, UpdateView, DeleteView, TemplateView
54
+
55
+ ```
14
56
 
15
57
 
16
58
 
59
+ パソコンで見た時は正常に、画像のように横に長い時はスクロールも出来ます。
60
+
17
- Googleの検証機能では、スマートフォンでもスクロールバーが表示され、折り返されずに表示されるのですが、実際のスマートフォンですとうまくいきません。
61
+ ![イメージ説明](64fb828f5ba66d0ee12da08bb1187414.png)
18
62
 
19
63
 
20
64
 
65
+ ところが、スマートフォンで見ると以下のように表示されてしまいます。
66
+
67
+ ![イメージ説明](16c67ecdd935bbaff6d489014e5e7577.jpeg)
68
+
69
+
70
+
71
+ スマートフォンでも折り返さずに表示したいのですが、上手くいきません。
72
+
73
+ ちなみに、Googleの検証ツールを使うとスマートフォンでも正常に横スクロール表示ができるのですが、実機では正常に動作しません。
74
+
75
+
76
+
77
+ 何かわかる方がいましたらアドバイス頂きたいです。
78
+
21
- どのうにすれば良ょうか?
79
+ ろしくお願いします。