2

私はこのようなCSSメニューを持っています...

<ul>
    <li><img src="...">Menu item</li>
    <li><img src="...">Menu item2</li>
</ul>

私のCSSは現在私にこれを与えます...

ここに画像の説明を入力

私が欲しいのは、このようなものです...

ここに画像の説明を入力

CSS を関連するビットに切り詰めようとしました - 重要なものを省略した場合はお知らせください...

ul#menu li ul li {
    position: relative;
    display: block;
    background-color: #fff;
    border-top: solid 1px #808080;
}

ul#menu li ul li:first-child {
    border-top: none;
}

ul#menu li ul li img {
    position: relative;
    left: 0px;
}

問題は、イメージが の<li>全幅ではない の子である<ul>ため、は ではなくにposition: relative; left: 0px;関連していることです。liul

に対して画像を配置するにはどうすればよいulですか?

4

3 に答える 3

1

1 つのシンプルなソリューション

ul#menu li ul li img {
    float: left;
    margin-top: 7px;
}
于 2013-08-18T18:03:41.873 に答える