Alex Selejan
asked 9 years ago

My question is, how can I make the secondary menu responsive ? I have followed the steps in provided as an answer to this question ( and everything worked out well. I have added the new menu in the area with the id #under-navigation. Do you happen to have any suggestions? or some best practices that I could implement or follow?

P.S. I need to mention that I only applied styling to style.css file and did not touch the responsive.css one

1 Answers
answered 9 years ago

Please send me your site for further checking.

replied 9 years ago

This would be the website . Currently I am still working in a staging environment. I don’t think I was specific enough. (My bad!) The menu is responsive, however I am trying to make the vertical menu lines align across different screen resolutions. Do you happen to have a recommendation on how I can achieve this ?

dominic Staff
replied 9 years ago

You can try the following code:

@media (max-width: 979px) {
.secondary-menu {
   background-color: #000!important;
.navbar-fixed {
    background-color: transparent;
.secondary-menu ul {
   margin-left: 0;
   background-color: #000;
   font-weight: normal;
.secondary-menu li a {
    color: #fff !important;
.secondary-menu ul li:nth-child(1) {
    border-top: 1px solid #222;
    border-left: 0;
.secondary-menu ul li {
   float: none;
.secondary-menu ul li {
    border-bottom: 1px solid #222;
    border-right: 0px none;
.secondary-menu li:hover {
    background-color: #111;

If you still face there issue, please send me username & password of your site for further checking.
Hope this helps !

Powered by DW Question & Answer Pro