Home>Support>Main navigation alignment

Main navigation alignment

By alshareef, 8 years ago. Last reply by Andrew Misplon, 8 years ago.

Hello,
I have a problem with my navigation bar alignment. I’m using Vantage premium, and I’m all new about this. I have a basic idea on how to deal with all different types the theme files. I have spent fair amount of time trying to figure out a solution for my problem with no luck.
my domain is Alshareeflawfirm.com
I know it is Arabic!! but I named one page Problem and the subpages 2nd problem and so on just to explain my problem little bit easier.
My question is, whey does the alignment of the text in these pages is not centered? and how can center the page called Problem and right align the subpages?
Thank you for you help
Ebrahim

URL: http://www.alshareeflawfirm.com

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 8 years, 10 months ago Andrew Misplon
    Hi, I Work Here

    Hi Alshareef

    The problem lies in the child theme style.css file. Perhaps you can ask the developer of this file to assist a little.

    If you want to try yourself, at Appearance > Editor > style.css there are four rules that are a problem, you’d need to use in page search to find them:

    .main-navigation .menu-item-has-children > a {
	padding-right: 0;
	padding-left: 48px;
}

	.main-navigation .menu-item-has-children > a {
		padding-right: 0;
		padding-left: 30px;
	}

	.main-navigation .menu-item-has-children > a {
		padding-right: 0;
		padding-left: 34px;
	}

	.main-navigation .menu-item-has-children > a {
		padding-right: 0;
		padding-left: 38px;
	}

    I think that’s all of them. In each case, change the 0 value to match whatever the second value is. For example, in the last rule above, you’d change 0 to 38px.

  2. 8 years, 10 months ago alshareef

    Thank you for your response. I developed this file myself. There was no one to ask but you guys :)

    However, I have solved the problem, which was in the file rtl.css which exist only in the Arabic version of WordPress to support right to left appearance. The original file is in Twenty Fifteen theme. I changed the rtl.css in the child theme which overwrites the original one which in turn overwrites the style.css in the Vantage theme. Long story!!

    I just added the same codes that you pasted and did what you told me. And it’s all good now.
    I thought some people out there might benefit from such problem.

    Thank you Andrew.

  3. 8 years, 10 months ago alshareef

    One question is still remaining, How to align the submenu to the right? or even center it?

    Thank you

  4. 8 years, 10 months ago Andrew Misplon
    Hi, I Work Here

    Awesome :) Nicely done!

    Sorry for missing the sub-menu question. Try adding:

    .main-navigation ul ul li a {
	text-align: right;
}

    Hope that helps.

  5. 8 years, 10 months ago alshareef

    Thank you Andrew. That helped.

    One thing that I had to deal with which is the submenu position. After I aligned the submenu text to the right, something didn’t look good because the submenu box is margining to the right not to the left, as if the website language was English.

    I had to write this code in style.css in the cilld theme:

     .main-navigation ul ul {
    box-shadow: 0;
    display: none;
    left: -73px;
    position: absolute;
    top: 100%;
}

    tags.

    I changed the left value from 0 to -73px to shift the submenu box to the left. It worked just fine.

    Thank you.

    Ebrahim Alshareef

  6. 8 years, 10 months ago Andrew Misplon
    Hi, I Work Here

    Awesome :) Glad to hear you’ve made progress. Thanks for sharing.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More