Div Css菜单包含图像

Question

在演示链接上：

• 如何让子菜单列表显示在蓝色边框的左上角？
• 在子菜单上，对于每个列表项，如何在悬停时更新图像？

Demo

HTML

<div id="nav1">
    <a1 href="#">GALAXY S</a>
</div>    
<div id="nav2">
    <a1 href="#">GALAXY A</a>
</div>

<div id="section5">
    <div id="left1">
       <a href="#">GALAXY S6 Edge</a>
       <a href="#">GALAXY S6</a>
       <a href="#">GALAXY S5</a>
       <a href="#">GALAXY S4 Mini</a>
       <a href="#">GALAXY S3 Mini VE</a>
    </div>
          <div id="right1">
             <p><img src="http://www.samsung.com/uk/next/img/estore-recommend-images/mobiles/S6edgegreen.jpg" alt=""></img>
             <a href="">GALAXY S6 Edge information</a></p>
          </div>    
</div>

<div id="section6">
    <div id="left1">
       <a href="">GALAXY A5</a>
       <a href="">GALAXY A3</a>
    </div>
          <div id="right1">
              <p><img src="http://www.samsung.com/uk/next/img/estore-recommend-images/mobiles/S6flatgold.jpg" alt=""></img></p>
          </div>
</div>

提前谢谢你。

Answer 1

对于第一个问题，

从

中删除display: inline-block;

#left1, #right1 {
  width: 49%;
}

而是添加float:left;

请参阅fiddle