0

ここにこのサイトがありますhttp://jamessuske.com/freelance/seasons/

下部にはソーシャル メディアのリストが表示されますが、ご覧のとおり、ごちゃごちゃしていて、その上に何かがあるように見えます。私は自分が間違っていることを理解していません。

これが私のCSSです：

ul.social-media{
    margin-left:20px;
    padding-top:30px;
}

ul.social-media li{
    float:left;
    padding-left:5px;
}

ul.social-media li.twitter{
    background-image:url(http://jamessuske.com/freelance/seasons/images/social.png);
    background-position-x:0px;
    width:25px;
    height:26px;
}

ul.social-media li.instagram{
    background-image:url(http://jamessuske.com/freelance/seasons/images/social.png);
    background-position-x:-26px;
    width:25px;
    height:26px;
}

ul.social-media li.facebook{
    background-image:url(http://jamessuske.com/freelance/seasons/images/social.png);
    background-position-x:-52px;
    width:25px;
    height:26px;
}

そしてHTML：

<ul class="social-media">
<li class="twitter"><a href="#">&nbsp;</a></li>
<li class="instagram"><a href="#">&nbsp;</a></li>
<li class="facebook"><a href="#">&nbsp;</a></li>
</ul>

どんな助けでも大歓迎です

4

3 に答える 3

2

クラスlist-style:none;に追加ul.social-media li

于 2013-07-20T05:15:18.643 に答える
0

更新: わかりました。あなたはulの弾丸を取り除いていないようです。 それが問題です。

list-style-type: none;

したがって、この

ul.social-media {
margin-left: 20px;
padding-top: 30px;
list-style-type: none;
}
于 2013-07-20T05:26:29.850 に答える
0

あなたの質問がよくわからなかったので、私の理解として - CSSで試してみmargin-top: 0px;てください。ul.social-media

これを試して -

ul.social-media{
  display: inline-block;
  margin-top: 0px;
  padding-top:30px;
}

継承されたスタイルを介してChrome Development Tool、あなたの<ul>テイクを見ることができます。したがって、この作業のためmargin-top: 16px;に設定する必要がありますmargin-top: 0px;

于 2013-07-20T05:21:13.103 に答える