响应性html布局崩溃

我需要做出响应性的布局，但我的菜单像图片中那样崩溃。我需要使菜单处于正确的位置，所以在我的css中添加了right:0px。我应该如何使菜单与正确的位置和工作响应

这就是它在正确位置的外观。

但当我删除右键时：0px；一切正常，但我需要正确的位置。 没有正确位置的示例

注册
阿克迪
Cosa票价
奥拉序数
阿齐恩德
丝虫
康塔蒂
#月经活动{
右：0px；
底部：0px；
位置：绝对位置；
边缘底部：5px；
}
#菜单区{
填充顶部：10px；
垫底：10px；
}
.菜单{
左边距：自动；
文本对齐：右对齐；
垫底：20px；
}
.菜单.底部{
页边顶部：自动；
文本对齐：右对齐；
}
.img{
最大宽度：100%；
位置：相对位置；
底部：0；
显示：表格；
显示：块；
保证金：自动
}

你能显示css或链接吗？在css中的菜单类中共享你的css文件alsoadd float:right。@Kami如果我添加float:right；，当我的菜单不在正确的位置时，它会有一点center。我不会对响应标题使用绝对定位。坚持静态并使用mediaqueries。或者发布更多代码（或JSFIDLE）如需其他帮助，您可以显示css或链接吗？在css中的菜单类中共享您的css文件alsoadd float:right。@Kami如果我添加float:right；，当我的菜单不在正确位置时，它会有一点center。我不会对响应标题使用绝对定位。请坚持静态并使用mediaqueries。或者发布更多代码（或JSFIDLE）以获取更多帮助

 <div class="row" id="menu_section">
  <div style=" margin-top:20px" class="four columns">
    <img class="img" src="images/logo.png">
  </div>
  <div class="eight columns">

    <div id="menuSection">
      <div class="menu top">
        <div class="item">Registrati</div>
        <div class="item">Accedi</div>
        <div class="item"><img src="images/shoppingCart.png"></div>
     </div>

      <div class="menu bottom">
        <div class="item"><b>C</b>osa fare</div>
        <div class="item"><b>O</b>rdina ora</div>
        <div class="item"><b>A</b>ziende</div>
        <div class="item"><b>F</b>ilosofia</div>
        <div class="item"><b>C</b>ontatti</div>
      </div>
    </div>
  </div>
</div>
#menuSection{
  right: 0px;
  bottom:0px;
  position: absolute;
  margin-bottom: 5px;
}

#menu_section{
padding-top: 10px;
padding-bottom: 10px;
}

.menu.top{
margin-left:auto;
text-align: right;
padding-bottom:20px;
}

.menu.bottom{
margin-top:auto;
text-align: right;
}

.img{
max-width:100%; 
position: relative; 
bottom: 0; 
display:table;     
display:block;
margin:auto;"
}