Question

由于某种原因，我的社交图标彼此太紧了。

它必须是我广泛的CSS中的一些东西导致它，因为当我将css和html放在一个新文档中它看起来没问题时，可以有人帮忙，谢谢

这是html

     <body>

     <div id="wrapperfull">

     <div id="head">

     <div id="header">
     <a href="index.html"><img src="../Images/Header.png" width="379" height="99" alt="Just Joel Header"></a>
     </div><!-- end header div -->

     <div class="navigation">
         <div class="menu-holder">
    <ul class="menu">
                <li><a href="index.html">Home</a>
                </li>
                <li><a href="about.html">About</a>
                </li>
                <li><a href='#'>Work</a>

            <ul class="submenu">
                <li><a href="print.html">Print</a>
                </li>
                <li><a href="branding.html">Branding</a>
                </li>
                <li><a href="photography.html">Photography</a>
                </li>
            </ul>
        </li>
        <li><a href="blog.html">Blog</a>
        </li>
        <li><a href="inspired.html">Inspired</a>
        </li>
        <li><a href="contact.html">Contact</a>
        </li>
             </ul>
         </div>
         <!-- menu-holder end -->
     </div><!-- end navigation div -->     
     </div>

     <div class="heading">

     <h1>CONTACT</h1>

     </div>

     <div class="blog-container">

         <p2>
           For further information or to request a quote, <br />
             feel free to contact me
         </p2>
           <p>&nbsp;</p>
         </p2>



           <p2>
           07866 36 39 38
           </p2>


       <p>&nbsp;</p>

       <p2><a href="mailto:joel@justjoel.co.uk">joel@justjoel.co.uk</a></p2>

     <div id="social">

  </a><a target="_blank" href="http://twitter.com/JustJoel_"><img          src=http://i1286.photobucket.com/albums/a604/JustJoel_/TwitterSocialMediaIcon_zps379a327e.png width="40" height="40" alt="Twitter"></a>
  <a target="_blank" href="http://www.linkedin.com/profile/view?id=119632044&amp;goback=.nmp_*1_*1_*1_*1_*1_*1_*1_*1_*1_*1&amp;trk=spm_pichttp://www.linkedin.com/profile/view?id=119632044&amp;goback=.nmp_*1_*1_*1_*1_*1_*1_*1_*1_*1_*1&amp;trk=spm_pic"><img src=http://i1286.photobucket.com/albums/a604/JustJoel_/LinkedinSocialMediaIcon_zps134a0ab5.png width="40" height="40" alt="Linkedin"></a>
  <a target="_blank" href="http://pinterest.com/justjoel80/boards/"><img src=http://i1286.photobucket.com/albums/a604/JustJoel_/PinterestSocialMediaIcon_zps9d3a3e93.png width="40" height="40" alt="Pinterest"></a>
  <a target="_blank" href="http://instagram.com/mole80"><img src=http://i1286.photobucket.com/albums/a604/JustJoel_/InstagramSocialMediaIcon_zpsdd09d3a4.png width="40" height="40" alt="Instagram"></a>
  <a target="_blank" href="https://plus.google.com/107489686537237947777/posts"><img src=http://i1286.photobucket.com/albums/a604/JustJoel_/GooglePlusSocialMediaIcon_zps9d93776b.png width="41" height="40" alt="Googleplus"></a>

     </div>

     </div>


          </div>

</div>


     </body>

这是CSS

     #social {
width: 210px;
height: 50px;
margin-top: 100px;
float: left;
padding-right: 5px;
     }

http://jsfiddle.net/Q6Lze/1/

Answer 1

你的内部有'a'的div，对吗？因此，您需要为此div中的元素配置属性。你需要这样的东西：

#social a{
   padding-left: 5px;
   (...)
}

社交媒体图标太靠近了

1 个答案: