html - 画像を横に並べる方法

Question

これら 2 つの「ハイパーリンク」アイコンを隣り合わせに配置しようとしていますが、それができないようです。ご覧のとおり、Twitter アイコンは次の行に落ちています.. (どちらもそれぞれの Web サイトにハイパーリンクされています)

HTML

<div class="nav3" style="height:705px;">
    <div id="icons"><a href="http://www.facebook.com/"><img src="images/facebook.png"></a>
    </div>
    <div id="icons"><a href="https://twitter.com"><img src="images/twitter.png"></a>
    </div>
</div>

CSS

.nav3 {
    background-color: #E9E8C7;
    height: auto;
    width: 150px;
    float: left;
    padding-left: 20px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #333333;
    padding-top: 20px;
    padding-right: 20px;
}

#icons{position:relative; 
    width: 64px; 
    height: 64px; 
   }

    #icons a:hover {
     background: #C93;
        display: block;

 }

並べて並べるにはどうすればよいですか?

前もって感謝します

Answer 1

両方の画像を並べてみてください。このような：

    <div id="icons"><a href="http://www.facebook.com/"><img src="images/facebook.png"></a><a href="https://twitter.com"><img src="images/twitter.png"></a>
    </div>