7

私のフッターには、ある種の架空の (フッター div の上部にある不要なパディング... 私が意味するものの例が必要な場合は、私のサイトにアクセスしてください) パディングがあるように見えます。私のサンプルリンクを表示すると、私が何を参照しているかがわかります。

<div id="footer">

<div id="Social">

<img src="img/Follow.png" width="339" height="21" alt="Follow on Social" style="position: relative; display:block;" />

<ul>
<li class="Twitter"><a href="#" target="_blank">Twitter</a></li>
<li class="Facebook"><a href="#" target="_blank">Facebook</a></li>
<li class="Youtube"><a href="#" target="_blank">Youtube</a></li>
<li class="Linkdin"><a href="#" target="_blank">Linkdin</a></li>
</ul> 

</div> <!-- Social -->

<div style="clear:both"></div>
</div> <!-- footer -->

My CSS:

#footer {
background-image:url(img/FooterBG.png);
height: 92px;
position: relative;
z-index: 10;    
padding: 0 35px;
left: 0px;
top: 82px;
}


#Social {
float: left;
width: 339px;
}


/* Social Links */

.Twitter a {
background-image: url(http://www.nerissagrigsby.com/wp-content/themes/twentytwelve/img/Twitter.png);
overflow: hidden;
text-indent: -999px;
display: block;
width: 42px;
height: 27px;
}


.Twitter a:hover {
background-position-y: 27px;

}

.Facebook a {
background-image: url(http://www.nerissagrigsby.com/wp-content/themes/twentytwelve/img/Facebook.png);
overflow: hidden;
text-indent: -999px;
display: block;
width: 18px;
height: 31px;
 }

 .Facebook a:hover {
background-position-y: 31px;
 }


 .Youtube a {
background-image: url(http://www.nerissagrigsby.com/wp-content/themes/twentytwelve/img/YouTube.png);
overflow: hidden;
text-indent: -999px;
display: block;
width: 29px;
height: 30px;
 }

 .Youtube a:hover {
background-position-y: 30px;
 }

 .Linkdin a {
background-image: url(http://www.nerissagrigsby.com/wp- content/themes/twentytwelve/img/LinkedIn.png);
overflow: hidden;
text-indent: -999px;
display: block;
width: 28px;
height: 29px;
}

.Linkdin a:hover {
background-position-y: 29px;    
}

#Social ul li {
display: inline-block;
margin-right: 24px; 
}

#Social ul {
margin: 12px 0 0 0;
padding: 0;
}

このパディングを削除するにはどうすればよいですか?

4

4 に答える 4

1

上を取り除く: 82px;

 #footer {
 background-image:url(img/FooterBG.png);
 height: 92px;
 position: relative;
 z-index: 10;    
 padding: 0 35px;
 left: 0px;
 /* top: 82px; */
 }
于 2013-01-30T23:39:04.303 に答える
0

あなたはcssリセットを使用してみることができます

次のものを使用することもできます。

<meta http-equiv="X-UA-Compatible" content="IE=edge">

念のため、InternetExplorerの問題です。

于 2013-02-01T04:36:43.943 に答える
0

@Herbert Petersその架空の境界が存在する理由がわかりませんでした。でも、外すと

 <div style="clear:both"></div>

それからそれはありません。

于 2013-04-05T12:46:02.870 に答える
0

マージン/パディングを 0 または負の値に設定するだけです (-1 を試してから、なくなるまで増やします)。

于 2013-04-11T16:54:13.300 に答える