I'm trying to align

I'm trying to align the navigation bar on this site so it's all on one horizontal line across the top. Right now, someone from my team added a gift card button and it messed up the navigation. Ideally, it will all align on the same line but worse case, I would like to take the gift card button down if this can't be fixed. http://blowdrybarhouston.com/menu-2/brazilian-blowouts/

  • David

    Your logo, nav, and button are all hardcoded in both size and position. Ideally they'd all be allowed to fill the space they need. There are a few options you could go with; my personal choice would be to reset all the CSS on the 3 elements and do them correctly.

    This will get them to be horizontal:
    #menu_wrapper li.menu-item { display: inline-block; }

    I noticed all of your site content is right-aligned and smashed in a small container. It's time to replace some team members, in my opinion.

  • Nithin

    Hi Jennifer,

    Is that a custom menu, or the default menu of the theme? Could you please try the following CSS code provided by David, and check whether that helps. If you are looking for a bit more customization, you could try the following:

    #menu_wrapper li.menu-item {
    	display: inline-block;
    }
    
    #menu_wrapper {
    
    	width: 100%;
    	text-align: center;
    	position: relative;
    }

    Also, add the following CSS to the Gift shop image, along with the existing hardcoded CSS, since it's not wrapped within a class, or ID, there isn't any other option, other than adding the following to the existing CSS:

    left: 88%;
    position: absolute;

    Would highly recommend that you make changes like this to a theme using a Child theme, so that it won't be overwritten when you update your theme, or a plugin like Simple Custom CSS.

    Kind Regards,
    Nithin

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.