ATTENTION, PLEASE READ: New topic creation is disabled, as we have moved to a new support system. Your existing topics will remain, but for all new requests you will need to use the new system. Click here to go to the new support request form.

• Back to forum

  Posted in: Neighborhood
• May 23, 2014 at 2:55 pm #77157
  Tomglover

  Member

  Post count: 25

  Hi there,

  I was wondering if you would be able to help me center my man nav menu.

  I am trying to make it like the image below (centered and evenly spaced to grid)

  http://abab5682.staging-cloud.netregistry.net/

  Thanks for your help in advance.

  May 26, 2014 at 9:42 am #77479
  Mohammad – SUPPORT

  Moderator

  Post count: 27441

  Hi,
  Your website is currently in maintenance mode .
  Thanks 🙂
  With Best Regards
  Swift Ideas

  May 31, 2014 at 12:40 am #79171
  Tomglover

  Member

  Post count: 25

  This reply has been marked as private.
  May 31, 2014 at 2:30 am #79176
  Mohammad – SUPPORT

  Moderator

  Post count: 27441

  Hi,
  Please use this custom css code:

  #main-navigation{margin-left:165px !important}
  #footer div.textwidget ul.social-icons{width:132px !important}

  Thanks 🙂
  With Best Regards
  Swift Ideas

  May 31, 2014 at 2:52 am #79182
  Tomglover

  Member

  Post count: 25

  Hi Mohammad,

  That worked for the social icons, but it didnt seem to centre the main menu?

  Regards,

  Tom.

  May 31, 2014 at 3:25 am #79184
  Mohammad – SUPPORT

  Moderator

  Post count: 27441

  Hi,
  Please remove that one css and use this one :

  #footer div.textwidget ul.social-icons{width:132px !important}
  #main-navigation {float: right;}
  #main-navigation{margin-left:165px !important}
  div#main-nav div.span9{width:920px !important}
  div#main-nav div.span3{width:220px !important}

  Thanks 🙂
  With Best Regards
  Swift Ideas

  May 31, 2014 at 2:18 pm #79221
  Tomglover

  Member

  Post count: 25

  Hi Mohammad,

  That code allows for the menu to be centred, however that doesn’t allow the menu to be fully spaced within the grid like the image displayed below.

  Regards,

  Tom.

  June 1, 2014 at 11:00 pm #79398
  Swift Ideas – Ed

  Keymaster

  Post count: 15264

  Hi @Tomglover,

  That issue is that you’d need to use a width % for the menu items, and given that they aren’t all the same size you’d likely see overlapping.

  Please remove the above code, apologies that was provided – not the best solution. This code is what would work best across all viewports.

  #main-nav .row {
  position: relative;
  }
  div#main-nav div.span9 {
  width: 100%!important;
  }
  #main-navigation {
  text-align: center;
  float: none;
  padding-right: 50px;
  }
  #main-navigation .menu li {
  float: none;
  }

  – Ed

  June 2, 2014 at 3:56 am #79409
  Tomglover

  Member

  Post count: 25

  Hi @ed

  That causes my search and cart icon to sit below the menu (I have attached this image)

  Regards,

  Tom.

  June 3, 2014 at 3:28 pm #79882
  Swift Ideas – Ed

  Keymaster

  Post count: 15264

  Apologies – missed one section of code:

  #main-nav .header-right {
  position: absolute;
  right: 0;
  }
  

  – Ed

  June 30, 2014 at 6:01 pm #87078
  navajeremiah

  Member

  Post count: 14

  What would I need to change in the above css to achieve the same centered menu in the Dante theme?

  June 30, 2014 at 6:32 pm #87091
  Swift Ideas – Ed

  Keymaster

  Post count: 15264

  @navajeremiah – please log your own topic for this, as it’s not relevant to the Neighborhood topic.

  – Ed

• Back to forum

  Posted in: Neighborhood