HTML，CSS，图像位置

Question

我不知道如何解决这个问题。我有高度菜单：72px和高度标识：117px。徽标仍然高度：72px。我做响应式设计。我可以通过保证金定位来实现这一目标，但我认为这对于响应能力并不好。

Picture

任何想法如何解决？非常感谢

  @font-face{font-family: Exo-Bold; src:url(../fonts/Exo-Bold.otf);}
  @font-face{font-family: Exo-Light; src:url(../fonts/Exo-Light.otf);}
  body 
{
background-color: white;
width: 100%;
margin: 0 auto;
}
a 
{
text-decoration: none;
}
a:link, a:visited
{
color: white;
}
a:hover, a:active
{
color: white;
text-decoration: underline;
}
.header
{
background-image: url(../images/bg-img.png);
background-repeat: repeat-x;
height: 72px;
width: 100%;
}

.header .nav
{
height: 72px;
margin-left: 15%;
}
.header .nav ul
{
margin: 0 auto;
list-style-type: none;
}
.header .nav ul li
{
float:left;
display: inline-block;
font-family: Exo-Bold;
font-size: 14px;
margin: 25px 20px;
}
.logo
{
background-image:url(../images/logo.png);
background-repeat: no-repeat;
height: 117px;
width: auto;
margin-left: 10%;
 }