MacでInternet Explorer 11での表示を確認するため、virtualboxを入れて、仮想環境でWindows10を入れたけど、Windows10が重い・遅いけど、なんとか設定で改善した話

どーもD-MARKING わたなべです。

ご訪問ありがとうございます。

昨日は土曜日のお休みで、お客さんでもある尾張旭にあるアイオートさんに、プリウスαちゃんのオイル交換にいってきました。（記事作成日も日曜ですが、休みの日の記事って、以外にいい情報を手にいれれるのですよね〜 本日もそうでした）

その際に、整備士の塚本くんと、ホームページの事を話しているとき、説明をしようと、事務所にあるWindowsにて、

D-Markingのサイトにアクセスすると、なんと、最近作成した、このホームページのメガメニュー（PCでドメインメニューをホバーすると、出てくるサブメニュー）の内容が、はみ出てる事に気づきました。

そんなはずは、と思いながらも、環境を聞いてみると、Windows10でInternet Explorer 11ということ、。

あれ？Windows10のブラウザって、Microsoft Edge（エッジ）じゃないの？聞くとも、デフォルトのブラウザを変更したかも、という感じでした。
何台かあるPCの設定等は曖昧だという感じでした。

結局しらべてみると、デフォルトはMicrosoft Edge（エッジ）なんですが、一応、過去のツールとして、Internet Explorer 11も利用出来るということ。
最終バージョンInternet Explorer11のみ、現在も非推奨ではなく、セキュリティアップデートはしているということ、Internet Explorerってもうサポート対象外かと思って、確認用のノートPC断捨離してしまったー、ということで

お客さんのところでの事実を受けて止めて、こんなケースもあるという事で、環境を整えなくては、と思い、
帰ってきて、子供が他の事に集中しだしたスキをみて、MacでInternet Explorer 11での表示を確認する方法を探し整えましたので、メモがてら掲載します。

MacでInternet Explorer 11での表示を確認する方法の準備

MACにvirtualboxを入れる

仮想PCを利用できるためのソフトです。

こちらからDL

https://www.virtualbox.org/wiki/Downloads

macなんでOSXを選び、DL

インストールしてください。

インストールが完了しない場合は、macの環境設定から、

セキュリティのところでひっかかってますので、許可してください。

Windows10をダウンロード

https://www.microsoft.com/ja-jp/software-download/windows10ISO

ライセンスは購入しましたが、確認するだけなら、ライセンス認証しなくても使えるとか、いう記事も見ましたが、不明。

virtualboxで仮想マシンを作って、そこにWindows10をいれる

virtualboxで仮想領域を作成する

外部リンクにします。

とにかく、１つ領域を作成

Mac の VirtualBox に Windows10 をインストール

Windows10をインストール

空っぽの仮想領域を起動すると、選択項目があらわれたので、そこで、ダウンロードしたWindowsファイルを選択

もしくは、仮想マシンのSATAポートにダウンロードしたWindowsファイルを選択

そして起動すると、インストールはじまりました。

項目を入力して、インストールを完了してください。

virtualboxを入れて、仮想環境でWindows10を入れたけど、Windows10が重い・遅い

結局書きたかった項目はここから、。

入れたけど、おっそい、おっもい、。これじゃ使えないよって感じでした。

virtualboxは簡単に日本語化できるので、設定ください。

解決法１ VirtualBox Guest Additionsをインストール

これは、Macにいれるのではなく、仮想環境にインストールするということでした。

それがわからなくて混乱した。

最初のvirtualboxをDL下サイトの

https://www.virtualbox.org/wiki/Downloads

このVirtualBox 6.1.10 Oracle VM VirtualBox Extension Packってやつです。

All supported platforms ってやつをDL

それを、まず仮想マシンのドライブに入れてやるということ、。

ここまだ混乱しているかも。

もしかしたら、ダウンロードする必要がないかも。

とにかく、

Macでコントロールしている仮想マシンで立ち上げたwin10にて、
virtualbox VMのメニュー▶デバイスから Guest Additions CD のイメージを挿入を選ぶ

そうすると、WIN10の環境設定でCDが挿入されているので、

スタート　Windows システムツール　PC と行き　CDを選べるのでクリックして

Guest Additionsをインストールする。

こすることで、virtualbox VMのメニュー　デバイス項目が利用可能になり、

MACとのファイルのやり取りやコピペも可能となる。

さらには速度が安定する。

僕の環境の場合、なぜかこれが外れたことがあったので、

コピペとかできなくなってたら、

デバイスからGuest Additions CD のイメージを挿入を再び選ぶとなおったような気が、、。不明確ですみません。手がかりを残します。

virtualboxの設定でこうなってればいいと思います。（Guest AdditionsのCDが入ってる）

解決方法2 設定を調整する

まず僕のimac レティナディスプレイなんで、解像度が高いので、最初表示を300%でやってたんですが、これがおかしくなる原因だったので、

サブモニタで仮想マシンのディスプレイを表示する事に決めて、100％ぐらいにして落ち着きました。

また、3Dアクセラレーションを有効化　にチェックを入れたら、よくなりました。

I/O APICを有効化も入れました。

表示はゲストOSの画面を自動的にリサイズをチェック

以上で、使えるというレベルまでに達しました。

ご参考までに。

おまけ、表示の崩れの原因

メガメニューの表示修正できました。

検証結果、

見てすぐ思ったのが、ボックスはしっかりしまわれるのに、内容が飛びててる。

これは、

overflow: hidden;

できえるのでは？

と思いそのとおりでした。

ie11は、親様子のhightが0でも、内容が飛び出るようです。

なので、親要素にoverflow: hidden;ではみ出たのは表示させない　と指示をいれたら、きれいになおりました。

ほかはほぼ満点でどこも表示崩れはありませんでした。

角丸が汚いとかはありますが、。

ブラウザのシェア率（ 世界）2020 年5月

ブラウザのシェア率（日本）2020 年5月

日本ではまだie11が9.21%もいるんですね〜！

これは対応しなければ危なかった！アイオートさんでの出来事に感謝！

僕は断然クローム派です。

スクショさせていただきました。

https://webrage.jp/techblog/pc_browser_share/

以上よろしくおねがいします。

それではgood web life!