###前提・実現したいこと
inline-blockを使用し、メニューをメイン画像の上に横並びに配置しました。ウィンドウサイズを変えた時に可変し、そのまま横並びで表示されるようにしたいのですができないのでしょうか?
###発生している問題
ウィンドウサイズをかえると自動で折り返される
###該当のソースコード html
``` <div id="headermenu">
<img class="logo" src="logo.png">
<ul>
<li>HOME<br>ホーム</li><li>
NEW ITEM<br>新商品</li><li>
CATEGORY<br>カテゴリー</li><li>
TOPICS<br>トピックス</li><li>
GUID<br>ガイド</li><li>
<input type="search" name="search"value="検索"></li><li>
<a href="">カート</a></li>
</ul>
</div> <!--headermanu -->
###該当のソースコード css
#headermenu{
height: 65px;
text-align: center;
overflow:hidden;
}
#headermenu > img{
float: left;
width: auto;
white-space:nowrap;
}
#headermenu > ul > li{
display: inline-block;
padding: 10px 2%;
display: inline\9;/* IE10以下 */
display: inline;/ IE7以下 /
_display: inline;/ IE6 */
#headermenu>ul>li> input{
width: 250px;
}
#headermenu>ul>li>a{
padding: 15px;
background-color: #fff;
}
###試したこと cssで自動に改行させないようにする方法を調べたのですがすべてが中央に寄ってしまったりするだけでうまくいきません。 どなたかお力を貸してください!
回答2件
あなたの回答
tips
プレビュー