выровнять навигационное меню с его родительским элементом

ссылка на веб-сайт: http://mattarlaw.com/ar Я работаю над многоязычным веб-сайтом. Проблема заключается в работе с арабским языком, который является языком справа налево. Навигационное меню не выровнено по нижнему правому краю каждого родительского элемента. Навигационное меню появляется при наведении. Изображение ниже объясняет проблему и результат, которого я хотел бы достичь: Пример проблемы

 header nav{
         clear: both;
         margin-left: 0px; 
         float: right;
        }
     

            .mean-nav .arMenu {
        	color: #fff;
        	text-align: right;
        }
        header nav ul{
         margin: 0;
         padding: 0;
         list-style: none; 
        }
         
        header nav ul li{
         float: right;
         margin: 0px 5px;
         position: relative;
         padding: 0;
        }
        
        header nav ul li a{
         text-align: center;
         width: 100%; 
         padding: 6px;
         display: block;
         text-decoration: none;
         font-size: 13px;
         color: #8a191b;  
         transition: ease-in-out all .2s;
         -moz-transition: ease-in-out all .2s;
         -webkit-transition: ease-in-out all .2s; 
        }
         
        header nav ul li a:hover{ 
         color: #000;
         transition: ease-in-out all .2s;
         -moz-transition: ease-in-out all .2s;
         -webkit-transition: ease-in-out all .2s;
         text-decoration: none;
        }
         
         
        header nav ul ul { /* this targets all sub main-navs */
         display: none; /* hide all sub main-navs from view */
         position: absolute;
         z-index: 9999;
         padding-top: 14px;
         margin: 0;
         margin-left: 0;
         padding-left: 0;
        
        }
         
        
        header nav ul ul li { /* this targets all submain-nav items */
         width: auto; /* set to the width you want your sub main-navs to be. This needs to match the value we set below */
         float: none;
         /*min-width: 100px; */
         white-space: nowrap;
         margin: 0; 
         padding: 0; 
         display: block; 
         border-bottom: 1px solid #fff;
        }
        
        header nav ul ul li a  { 
         font-size: 12px;
         font-weight: normal; 
         color: #fff;
         text-align: right;
         height: 26px;
         line-height: 26px;
         background-image: none;
         text-decoration: none;
         border: 0; 
         padding: 0px 5px; 
         background: #8a191b;
         opacity: 1;
         border: none; 
         box-shadow: none; 
        }
<div class="nav">
	<header>
		<nav>
			<ul id="menu-header" class="menu">
				<li id="menu-item-776" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-776">
					<a href="http://mattarlaw.com/ar/%d8%a7%d9%84%d9%85%d9%83%d8%aa%d8%a8/">
						<div class="arMenu">المكتب</div>
					</a>
					<ul class="sub-menu">
						<li id="menu-item-105" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-105"><a href="http://mattarlaw.com/ar/%d9%85%d8%ad%d8%a7%d9%85%d9%88%d9%86-%d9%81%d9%8a-%d9%84%d8%a8%d9%86%d8%a7%d9%86-%d8%aa%d8%b9%d8%b1%d9%8a%d9%81/">من نحن</a></li>
						<li id="menu-item-109" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-109"><a href="http://mattarlaw.com/ar/%d9%85%d8%ad%d8%a7%d9%85%d9%8a-%d9%84%d8%a8%d9%86%d8%a7%d9%86-%d9%85%d8%a8%d8%a7%d8%af%d8%a4%d9%86%d8%a7/">مبادؤنا</a></li>
						<li id="menu-item-113" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-113"><a href="http://mattarlaw.com/ar/%d9%85%d8%ad%d8%a7%d9%85%d9%88%d9%86-%d9%84%d8%a8%d9%86%d8%a7%d9%86-%d8%a7%d9%84%d9%82%d8%b6%d8%a7%d9%8a%d8%a7/">القضايا</a></li>
						<li id="menu-item-118" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-118"><a href="http://mattarlaw.com/ar/nominations-awards/">الجوائز والتسميات</a></li>
					</ul>
				</li>
			</ul>
		</nav>
	</header>
</div>

Спасибо


person TooFast    schedule 30.09.2016    source источник
comment
Можете ли вы также вставить свой html?   -  person RasmusGlenvig    schedule 30.09.2016
comment
ul.sub-меню {справа: 5px;}   -  person channasmcs    schedule 30.09.2016


Ответы (1)


в newtheme_arab.css сделайте так:

header nav ul ul {
    display: none;
    position: absolute;
    z-index: 9999;
    //padding-top: 14px; remove this line 
    margin: 0;
    margin-left: 0;
    padding-left: 0;
    right: 5px; //add this line
}
person Mustapha Larhrouch    schedule 30.09.2016
comment
Спасибо Мустафа! именно то, что мне было нужно. Работал как шарм для меня - person TooFast; 30.09.2016