如何通過CSS重新定位dropdownmenu

我想將DropDownMenu的位置設置在標題底部，作爲項目「Acceuil」，並且我使用了CSS樣式。但它不起作用。我的代碼如下：使用「的styleClass =」 groupstyle」來調整位置如何通過CSS重新定位dropdownmenu

是任何人都知道如何解決這個問題感謝事先您迴應

<rich:toolBarGroup> 
    <s:link id="menuHomeId" view="/home.xhtml" value="#{messages.Home}" 
     propagation="none" styleClass="groupstyle"/> 
</rich:toolBarGroup> 

<rich:dropDownMenu showDelay="250" hideDelay="0" submitMode="none" styleClass="groupstyle"> 
    <f:facet name="label">ParamÃ¨tres</f:facet> 
    <rich:menuItem> 
     <s:link view="/UsersList.xhtml" value="Gestion des utilisateurs" 
      id="UtilisateursId1" includePageParams="false" propagation="none"/> 
    </rich:menuItem> 
    <rich:menuItem> 
     <s:link view="/ImportData.xhtml" value="Import des donnÃ©es" 
      id="ImportDonnees" includePageParams="false" propagation="none"/> 
    </rich:menuItem> 
    <rich:menuItem> 
     <s:link view="/ImExrtportLocaux.xhtml" 
      value="Import/Export des locaux" id="ImpExrportLocaux" 
      includePageParams="false" propagation="none"/> 
    </rich:menuItem> 
    <rich:menuGroup value="Export des donnÃ©es" direction="bottom-right"> 
     <rich:menuItem> 
      <s:link view="/XLSOccupantList.seam" value="Export des occupants" 
       id="ExporteOccupants" includePageParams="false" propagation="none"/> 
     </rich:menuItem> 
     <rich:menuItem> 
      <s:link view="/XLSOccupantList.seam" value="Export des occupants" 
       id="ExporteOccupants2" includePageParams="false" propagation="none"/> 
     </rich:menuItem> 
    </rich:menuGroup> 
    <rich:menuItem> 
     <s:link view="/ContactList.xhtml" value="Contact List" 
      id="ContactId1" includePageParams="false" propagation="none"/> 
    </rich:menuItem> 
    <rich:menuItem> 
     <s:link view="/ReglagesList.xhtml" value="Reglages List" 
      id="ReglagesId1" includePageParams="false" propagation="none"/> 
    </rich:menuItem> 
    <rich:menuItem> 
     <s:link view="/DiversList.xhtml" value="Divers List" id="DiversId1" 
      includePageParams="false" propagation="none" /> 
    </rich:menuItem> 
    <rich:menuItem> 
     <s:link view="/MessageAccList.xhtml" value="Message Acc" id="MessageAcc" 
      includePageParams="false" propagation="none"/> 
    </rich:menuItem> 
</rich:dropDownMenu>

這是我的CSS？文件：

.rich-toolbar, .rich-toolbar td { 
background-color: #64BEC6; 
height:120px; 
} 

.rich-toolbar-item, .rich-toolbar-item a { 
background-color: #64BEC6; 
height:50px; 
} 

.rich-toolbar-item a:hover { 
text-decoration: underline; 
} 

.rich-menu-item a:hover{ 
text-decoration: none; 
} 

.groupstyle{ 
    font-size:14px; 
position:relative; 
    bottom:-35px; 
text-decoration: none; 
}

來源

2013-10-01 user2746076

向我們展示您擁有的CSS？ – Ruddy

我在問題中添加了css。 – user2746076

菜單的位置被限定在<div>本身，例如

<div … style="z-index: 2; left: -7px; top: 2px; width: 119px; display: block;">

這意味着任何類別規則都將被覆蓋。必要時防止使用!important。

.groupstyle { 
    font-size: 14px; 
    position: relative !important; 
    bottom: -35px !important; 
    text-decoration: none; 
}

來源

2013-10-02 08:50:41 Makhiel

如何通過CSS重新定位dropdownmenu

回答

相關問題