質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
Internet Explorer

Internet Explorer(IE;MSIE)はマイクロソフトが開発したウェブブラウザです。Microsoft Windowsに組み込まれています。

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

1回答

330閲覧

WordPress 一部のIE11でheightが無視される

seisaku

総合スコア7

Internet Explorer

Internet Explorer(IE;MSIE)はマイクロソフトが開発したウェブブラウザです。Microsoft Windowsに組み込まれています。

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2018/10/02 10:57

WordPress上で表示されるボックスが、一部のIE11でheightの数値が無視されauto状態になります。
それに伴って、heightがauto状態ですのでoverflowも効いていません。
すべてのIE11でheightの数値が無視される訳ではなく、正しく表示されるものもあり、正しく表示されない
環境を再現することができません。X-UA-Compatibleで互換制御もしています。
FirefoxやChrome、Safari、Android、iPhoneでは問題なく表示されます。
一部のIE11でしか起きない状況が全くわかりません。
以下該当箇所の記述(抜粋)になります。

#easy_tab_plg{margin-bottom: 15px;border: 4px solid #1C1C1C; width: 100%; /* background: none repeat scroll 0 0 #000000; */} .content-wrapper{margin-top: 15px;} .no-padding-left{padding-left: 0px;} .tab-container .panel-container { /* border: solid #666 1px; */ padding: 10px; -moz-border-radius: 0 4px 4px 4px; -webkit-border-radius: 0 4px 4px 4px; } .panel-container {background:#ffffff; height:325px; overflow:auto; /* margin-bottom: 10px; min-height: 100px; */} .panel-container a{color: white;} .panel-container ul{margin:0; padding:0;} .panel-container ul li{border-bottom: dotted 1px; padding: 5px;list-style: inside;list-style-image:url('images/icon/etab-arrow.png');} .panel-container ul li:hover{background:#c0c0c0;} .panel-container ul li a{color: #000;}
<div class="content-wrapper"> <div class="col-lg-8 no-padding-left"> <div class="row"> <?php if (is_front_page()): ?> <div id="easy_tab_plg"> <div id="tab-container" class='tab-container'> <ul class='etabs'> <li class='tab m-news'> <a href="#tabs1-news">ニュース <span class="sub-heading">News</span></a> </li> </ul> <div class='panel-container'> <div id="tabs1-news"> <?php $my_query4 = new WP_Query('cat=5'); ?> <ul> <?php if ($my_query4->have_posts()) : ?> <?php while ($my_query4->have_posts()) : $my_query4->the_post(); ?> <li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li> <?php endwhile; ?> <?php endif; ?> </ul> </div> </div> </div> </div> <?php endif; ?> </div> </div> </div>

素人同然ですので、とんでもなくバカな質問をしているかもしれませんが、
何卒ご教授お願いいたします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

x_x

2018/10/03 01:04

X-UA-Compatibleで互換制御というのは具体的にどう書いているのでしょうか?
seisaku

2018/10/03 02:31

headの中に<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />を記述しています。
x_x

2018/10/03 02:43

ヘッダにかかわらず設定によりイントラネットは互換表示になりますが、そこは大丈夫でしょうか?
seisaku

2018/10/03 02:59

現状、この現象が確認できているのは、ルーター→ハブ にぶら下がっているだけのPCですので、イントラネット内のPCではないはずです。同じハブにつながっている別のPC(WIn7/IE11)は正しく表示されています。
x_x

2018/10/03 03:03

よくわかりませんが、IEの互換表示設定で「イントラネット サイトを互換表示で表示する」のチェックをつけたり外したりするとどうですか?
seisaku

2018/10/04 00:54

チェックを外したところ、表示されました。ありがとうございます。イントラネットの何たるかを全く理解しておりませんでした。もう一つお教えていだけますでしょうか。イントラネット関連のチェックを入れた状態で表示させる方法はありますでしょうか。よろしくお願いいたします。
guest

回答1

0

ベストアンサー

信頼済みサイトに登録しても互換表示になるため、チェックを入れた状態では難しいでしょう。
https://support.microsoft.com/ja-jp/help/2904443

チェックを外した状態で運用し、もしほかに互換表示が必要なイントラネットサイトがあれば個別に追加していくことになりそうです。

また、このチェック状態をグループポリシーで制御することは可能のようです。
http://miyamon-se-exp.hatenablog.jp/entry/2016/10/16/000320

投稿2018/10/04 01:14

x_x

総合スコア13749

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

seisaku

2018/10/04 01:57

大変勉強になりました。ありがとうございます。 デザイナー上がりの私には荷が重いので、クライアントには状況を説明し、 他の大多数がきちんと見れているとして納得してもらうことにします。 グループポリシーでの制御は折を見て試してみたいと思います。 ありがとうございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問