katudousyoukai.pngとmousikomi.pngとtoiawase.pngを横並びにしました。これをどの端末で開いても、横並び一列になるようにするにはどうすればよいでしょうか。class ="menue"のwidthをいじってもうまくいきません。また、左右に出る余白もなくしたいです。
<body> <style> * { margin: 0px; padding: 0px; } .header { width: 100%; height: auto; } .menue { width: ??; height: auto; } .font1 { font-size: 20px; font-family: "YuGothic","Yu Gothic","Meiryo","ヒラギノ角ゴ","sans-serif"; } .center{ border: 1px solid #aaa; width: 400px; text-align: center; } .box1 { padding: 0.5em 1em; margin: 2em 0; color: #232323; background: #fff8e8; border-left: solid 10px #ffc06e; } .inline-block_test { display: inline-block; /* インラインブロック要素にする */ padding: 0px; /* 余白指定 */ height: 100px; /* 高さ指定 */ } .parent { text-align: center; /* 子要素を左右中央揃えにする */ border: solid 0px; /* 枠線指定 */ padding: 0px; /* 余白指定 */ } </style> <body bgcolor="CCFF99"> <header> <img src="figure1.png" class="header" alt="" /> </header> <div class="parent"> <div class="inline-block_test"> <a href=""><img src="katudousyoukai.png" class="menue" alt="" width="" height=""/></a> </div> <div class="inline-block_test"> <a href=""><img src="mousikomi.png" class="menue" alt="" width="" height=""/></a> </div> <div class="inline-block_test"> <a href=""><img src="toiawase.png" class="menue" alt="" width="" height=""/></a> </div> </div> </body> </html>
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。