質問編集履歴
1
内容追記
title
CHANGED
File without changes
|
body
CHANGED
@@ -13,4 +13,129 @@
|
|
13
13
|
IEのデバッグモードでバージョン?をIE9にすると少しだけ改善されます。
|
14
14
|
元はChromeやFireFoxのみで使用予定だったこともありbulmaも併せて勉強したかったので使用していたのですが、急きょIEにも対応しなければいけなくなった際にこのようなレイアウトが崩れてしまう場合は諦めてIEにも完全に対応している他のフレームワークやライブラリを使うしかないのでしょうか?
|
15
15
|
またデバッグでエラーがでていないからライブラリに問題があるのかと考えているのですが他に確認するべき個所はありますでしょうか?
|
16
|
-
かなり初歩的な質問で申し訳ないのですがこのような場合の考え方を教えていただけたら嬉しいです。
|
16
|
+
かなり初歩的な質問で申し訳ないのですがこのような場合の考え方を教えていただけたら嬉しいです。
|
17
|
+
|
18
|
+
|
19
|
+
以下htmlです
|
20
|
+
ライブラリなどはローカルに落として使っています
|
21
|
+
Node-Redと連動しているのでJS、CSSは{{{js.javascript}}}、{{{css.cssfile}}}のように読み込んでいます
|
22
|
+
一部名称などは伏せています
|
23
|
+
またhtmlの書き方もひどい部分があると思いますが宜しくお願い致します
|
24
|
+
```html
|
25
|
+
<!DOCTYPE html>
|
26
|
+
<html>
|
27
|
+
<head>
|
28
|
+
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
|
29
|
+
<meta charset="utf-8">
|
30
|
+
<title>*****</title>
|
31
|
+
<link rel="stylesheet" href="./static/bulma.min.css">
|
32
|
+
<link rel="stylesheet" href="./static/all.min.css">
|
33
|
+
<link rel="stylesheet" href="./static/noto.css">
|
34
|
+
<link rel="stylesheet" href="./static/iconfont/material-icons.css">
|
35
|
+
<link rel="stylesheet" href="./static/flatpickr.min.css">
|
36
|
+
<link rel="stylesheet" href="./static/dark.css">
|
37
|
+
<script src="./static/flatpickr.js"></script>
|
38
|
+
<script src="./static/japanese.js"></script>
|
39
|
+
<script src="./static/moment.min.js"></script>
|
40
|
+
<script src="./static/jquery-3.3.1.js"></script>
|
41
|
+
</head>
|
42
|
+
<body>
|
43
|
+
<div class="hero" style="background-color: rgb(112, 112, 218)">
|
44
|
+
<div class="hero-body">
|
45
|
+
<div class="container">
|
46
|
+
<h1 class="title" style="color: white">*****</h1>
|
47
|
+
</div>
|
48
|
+
</div>
|
49
|
+
</div>
|
50
|
+
<main class="columns">
|
51
|
+
<div class="submenu column is-8" style="outline-color: #DCC2FF">
|
52
|
+
<aside class="box" style='font-size: 25px;'>*****</aside>
|
53
|
+
</div>
|
54
|
+
</main>
|
55
|
+
<div class="tile is-ancestor">
|
56
|
+
<div class="tile is-vertical is-8">
|
57
|
+
<div class="tile">
|
58
|
+
<div class="tile is-parent is-vertical">
|
59
|
+
<article class="tile is-child notification is-light">
|
60
|
+
<div>
|
61
|
+
<p class="title">*****</p>
|
62
|
+
<div class="select is-link">
|
63
|
+
<form name="select">
|
64
|
+
<select id="tablename2" onInput="viewselect2(this)"></select>
|
65
|
+
</form>
|
66
|
+
</div>
|
67
|
+
<br>
|
68
|
+
<br>
|
69
|
+
<p class="title">*****/*****</p>
|
70
|
+
<input class="flatpickr" id="pickr" type="text" placeholder="*****" readonly="readonly" pattern="^[0-9A-Za-z]+$" title="直接入力する際は半角数字で入力してください"> ~
|
71
|
+
<input class="flatpickr" id="pickr2" type="text" placeholder="*****" readonly="readonly" pattern="^[0-9A-Za-z]+$" title="直接入力する際は半角数字で入力してください">
|
72
|
+
<br>
|
73
|
+
<br>
|
74
|
+
<p class="title">*****</p>
|
75
|
+
<div>
|
76
|
+
<table id="datatable" class="table is-bordered is-hoverable is-fullwidth">
|
77
|
+
<thead>
|
78
|
+
<tr class="is-selected" style="background-color: rgb(112, 112, 218)">
|
79
|
+
<th>*****</th> <th>**********</th>
|
80
|
+
</tr>
|
81
|
+
</thead>
|
82
|
+
<tbody id="tablebody">
|
83
|
+
|
84
|
+
</tbody>
|
85
|
+
</table>
|
86
|
+
</div>
|
87
|
+
<br>
|
88
|
+
<br>
|
89
|
+
<div id="fileDateSelect">
|
90
|
+
<p class="title">*****</p>
|
91
|
+
<input class="flatpickr" id="pickrFileDate" type="text" placeholder="*****" readonly="readonly" pattern="^[0-9A-Za-z]+$">
|
92
|
+
</div>
|
93
|
+
<br>
|
94
|
+
<div class="output_button">
|
95
|
+
<div class="control">
|
96
|
+
<form method='POST' id='myform1'><input class="button is-link is-outlined is-large" type='submit' value='*****'/></form>
|
97
|
+
</div>
|
98
|
+
<div id="area1"></div>
|
99
|
+
</div>
|
100
|
+
</div>
|
101
|
+
</article>
|
102
|
+
</div>
|
103
|
+
</div>
|
104
|
+
</div>
|
105
|
+
</div>
|
106
|
+
<sub class="columns">
|
107
|
+
<div class="submenu column is-12" style="outline-color: #DCC2FF">
|
108
|
+
<aside class="box" style='font-size: 25px;'>
|
109
|
+
*****
|
110
|
+
</aside>
|
111
|
+
</div>
|
112
|
+
</sub>
|
113
|
+
<div class="tile is-ancestor">
|
114
|
+
<div class="tile is-vertical is-12">
|
115
|
+
<div class="tile">
|
116
|
+
<div class="tile is-parent is-vertical">
|
117
|
+
<article class="tile is-child notification is-light">
|
118
|
+
<p class="title">*****</p>
|
119
|
+
<div class="select is-link">
|
120
|
+
<form name="select" id="csvSelect">
|
121
|
+
<select id="tablename" onChange="viewselect(this)" onload="viewselect(this)"></select>
|
122
|
+
</form>
|
123
|
+
</div>
|
124
|
+
<div class="control">
|
125
|
+
<button class="button is-link is-outlined is-hovered is-large" onClick="diray()">*****</button>
|
126
|
+
</div>
|
127
|
+
<div id="area3"></div>
|
128
|
+
</article>
|
129
|
+
</div>
|
130
|
+
</div>
|
131
|
+
</div>
|
132
|
+
</div>
|
133
|
+
<script>
|
134
|
+
{{{js.javascript}}}
|
135
|
+
</script>
|
136
|
+
<style>
|
137
|
+
{{{css.cssfile}}}
|
138
|
+
</style>
|
139
|
+
</body>
|
140
|
+
</html>
|
141
|
+
```
|