「kaz_javaSpringBootプログラム自動作成◎自動生成」のレスポンシブデザイン的な調査

10:15
①レスポンシブデザインのスマホ向け。
　・昨日の以下画面が、いまいちなので、CSSを使って、はみだし部分が無いようにして、見栄えを良くする調査。

②調査結果として、CSSに「min-width: 100%;」と「display: inline-block;」を追加すればいけることがわかった。
　・次回のツールバージョンアップにこれを入れよう。
www.vector.co.jp
■layout.css

#wrapper
{
＜＜削除　start＞＞
	width: 100%;
＜＜削除　end＞＞
＜＜追加　start＞＞
	min-width: 100%;
	display: inline-block;
＜＜追加　end＞＞
	margin: 0 auto;
	text-align: left;
}
#contents
{
	clear:both;
	background: url(../img/bg_contents.gif) repeat-x left top;
	background-color:#E6E6E6;
	padding:20px 0 20px 0;
＜＜追加　start＞＞
	min-width: 100%;
	display: inline-block;
＜＜追加　end＞＞
}

11:34
①出来上がった。いい感じになっている。
■スマホ実機の画面。
・まず、スマホ実機のログイン画面。これ、昨日と同じ感じ

・『ハンバーグメニュー』押下後。左からスライドするようにメニューが出る。これ、昨日とおなじ感じ

・ユーザー情報一覧（更新削除）画面選択。これ、はみだし部分が無くなって、見栄えがよくなった。

・さらに、『ハンバーグメニュー』押下後。
　ユーザー情報一覧（更新削除）画面に、覆いかぶせた形でメニューが出る。これ、昨日とおなじ感じ

・ユーザー情報登録画面選択。これも、これ、はみだし部分が無くなって、見栄えがよくなった。

・『ハンバーグメニュー』押下後。これ、昨日とおなじ感じ

・メニューの最後まで画面をスワイプする。これ、昨日とおなじ感じ