☆　ホームの３テキストボックス横並び３列の配置・floatを使用

• floatを使ったこの方法の利点は、

Internet Explorer８以前に対応している事です。

• この方法のやっかいなところは、

・３つのボックス全体を中央に配置する点で、３つのボックスを１つにまとめるボックスに｢margin-left:5%;｣と左の余白を％指定すると完全な中央ではないが、体裁が取れました。
・floatを使っているので、適宜clearを入れる必要があります。

☆　３つの要素・横並び３列の配置・display:flexを使用

ＣＳＳ３から使用出来るようになった｢display:flex;｣を使っていて、主要ブラウザのInternet Explorer(IE)９以降、GoogleChrome、Safari、Firefox、Opera）では、問題無く動作します。IE８以前ですと、デザインが崩れます。
｢display:flex;｣は、非常に便利で簡単な記述で横並びにボックスを中央に配置出来ます。float や　clear なども不要です。使い方は作成のポイント→横３列・３要素

ボックスは簡単にできますが、苦戦したのは、メディアクエリーで初めての挑戦なので試行錯誤でした。ボックス配置をパソコン、タブレットとスマホとそれぞれに合わせたＣＳＳ記述をしなければならないのです。正直、疲れます。！！

☆　Internet Explorer8（ＩＥ８）以前の対応

ＩＥ８以前ではＨＴＭＬ５、ＣＳＳ３に対応していないため、以下の記述をします。

<!--[if lt IE 9]>
<script src="https://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
<script type="text/javascript" src="https://html5shiv.googlecode.com/svn/trunk/html5.js"></script>

但し、上記で何処まで対応しているかは、ＨＴＭＬ５とＣＳＳ３の新機能を個別にテストしていないので、判然としません。「３つの要素で使用のdisplay:flex;」は、対応していないようです。

☆　使用しているWordPress PlugIn（ＡＢＣ順）

　 1.Better Delete Revision
：編集時更新されるリビジョンを削除→ＤＢの最適化
　 2.Crayon Syntax Highlighter
：html cssを表示するボックス
　 3.Counterize
：カウンター
　 4.PS Disable Auto Formatting
：自動整形&タグ除去回避、テキスト編集には必須
　 5.Zia3-JS-CSS
：適用ページだけに有効なＣＳＳとJavaScript