Q&A
###前提・実現したいこと
Monacaで買い物リストシステムを作っています。
画像と文字を綺麗に並べたいのですが、添付画像のようにずれてしまいます。
文字も真ん中に寄せられてない気がします。
vertical-alignとか使ってみたものの全く変わりません。
###該当のソースコード
html
1<!DOCTYPE HTML> 2<html> 3<head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> 6 <meta http-equiv="Content-Security-Policy" content="default-src * data:; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'"> 7 <script src="components/loader.js"></script> 8 <link rel="stylesheet" href="components/loader.css"> 9 <link rel="stylesheet" href="css/style.css"> 10 <script> 11 </script> 12</head> 13<body> 14 <div id="header"> 15 <img class="upicon1" src="/res/android/icon/menu.png" align="left"> 16 <p>リストに追加する</p> 17 <img class="upicon2" src="/res/android/icon/back.png" align="right"> 18 </div> 19 <div id="main"> 20 </div> 21</body> 22</html>
css
1/**/ 2div img { 3 height:125px; 4 width:125px; 5} 6 7p { 8 text-align:center; 9} 10
回答2件
0
ベストアンサー
align属性はHTML5で廃止されていますので使わないようにしましょう。
CSS
1#header { 2 display: flex; 3 justify-content: space-between; 4}
投稿2017/07/07 03:16
総合スコア13749
0
文字の前要素にfloatはかかっていませんか？
投稿2017/07/07 03:12
総合スコア27
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2017/07/07 06:54