2012-06-16 4 views
-1

Я хотел бы плавать изображение в div # rakshak справа от div # MainMenu. Как я могу исправить CSS на сайте нижеПлавающее изображение вправо

[сайт удален]

+0

Изменить поплавок влево на #MainMenu. Возможно, вам придется немного поиграть, но вы должны получить эту идею. –

+0

@apurv На всякий случай вы не заметили .. Чернильный горшок становится срезанным по верхнему и нижнему колонтитулам при прокрутке вверх и вниз. – Playmaker

+0

Спасибо @Playmaker. Я знаю об этом и пытался его исправить, используя z-index. Однако это не помогло решить проблему. – arjunurs

ответ

1

У вас есть поплавки как главного меню div, так и rakshak div, расположенного вправо.

Я предлагаю вам либо изменить меню поплавка влево, который будет решить проблему, иначе вы измените порядок дивы

вариант 1

 
#MainMenu { 
float: left; 
clear: right; 
margin-right: -8px; 
margin-top: 42px; 
} 

Вариант 2

<div id="MainHeader" class="pageWrapper clearfix"> 
       <h1 id="Logo"><a href="http://www.gauravgatha.org"> <img src="http://www.gauravgatha.org/wp-content/uploads/2012/05/logo.png" alt="Gaurav Gatha" width="140" height="40"></a></h1> 
<div id="rakshak" style="clear: right;float:right; margin-top:35px;"> 
         <a href="http://www.rakshakfoundation.org"><img src="http://www.gauravgatha.org/wp-content/themes/parallelus-salutation/assets/images/rakshak.png"></a> 
        </div> 


       <div id="MainMenu"> 
        <div class="inner-1"> 
         <div class="inner-2"> 
          <nav> 

           <div id="MM" class="slideMenu"> 
            <ul id="menu-main-menu" class="menu"><li id="menu-item-3552" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-3552"><a href="http://www.gauravgatha.org">Home</a></li> 
<li id="menu-item-3554" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-3554" style="z-index: 300; "><a href="#" class="hasSubMenu">Contest<span class="subDown"></span></a> 
<ul class="sub-menu" style="top: 31px; display: none; visibility: visible; "> 
    <li id="menu-item-3553" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3553"><a href="http://www.gauravgatha.org/contest/rules/">Rules and Regulations</a></li> 
    <li id="menu-item-3555" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3555"><a href="http://www.gauravgatha.org/contest/judging-criteria/">Judging Criteria</a></li> 
    <li id="menu-item-3556" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3556"><a href="http://www.gauravgatha.org/contest/the-jury/">The Jury</a></li> 
    <li id="menu-item-3557" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3557"><a href="http://www.gauravgatha.org/contest/rules/">Rules and Regulations</a></li> 
    <li id="menu-item-3558" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3558"><a href="http://www.gauravgatha.org/contest/important-dates/">Important Dates</a></li> 
</ul> 
</li> 
<li id="menu-item-3559" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-3559"><a href="#">Participate</a></li> 
<li id="menu-item-3560" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3560"><a href="http://www.gauravgatha.org/faqs/">FAQs</a></li> 
<li id="menu-item-3561" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3561"><a href="http://www.gauravgatha.org/contact/">Contact Us</a></li> 
<li id="menu-item-3563" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-3563"><a href="http://www.rakshakfoundation.org/poem/" onclick="javascript:_gaq.push(['_trackEvent','outbound-menu','http://www.rakshakfoundation.org']);">Last Year Entries</a></li> 
</ul>           <div style="clear:left"></div> 
           </div> 

          </nav> 
         </div> 
        </div> 
       </div> 



      </div> 

Вам нужно будет изменить стиль главного меню:

 
#MainMenu { 
float: right; 
margin-right: 20px; 
margin-top: 42px; 
} 
+0

Спасибо. Я использовал вариант 2 :) – arjunurs

0

изменения положения Ракшака и MainMenu или поплавка слева в главном меню

2

Подставьте свои места в HTML (Div # Ракшака должно быть выше div # MainMenu в html), удалите clear: справа от div # MainMenu, и если вы хотите увеличить его margin-right above 0 (мое предложение - 10px).

Смежные вопросы