как переселить dropdownmenu с помощью CSS

0

Я хотел бы установить расположение DropDownMenu в нижней части заголовка, как элемент "Acceuil", и я использовал стиль css. Но это не сработает. Мой код выглядит следующим образом: с помощью "styleclass=" groupstyle "для настройки местоположения.

Кто-нибудь знает, как решить проблему? Спасибо за ваш ответ заранее.

<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;
 }
  • 1
    Покажите нам CSS у вас есть ...
  • 0
    Я добавил CSS в вопрос.
Теги:
drop-down-menu
richfaces

1 ответ

0
Лучший ответ

Позиция меню определяется самим <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;
}

Ещё вопросы

Сообщество Overcoder
Наверх
Меню