Пункт пространство между в пункте меню не работает в asp.net

Я хотел бы дать пробел между пунктом меню asp.net. Следовательно, я пытался с staticmenuitemstyle а также horizontalpadding="10" атрибут, который был предложен другим постом в SO. Но это не работает.

<staticmenuitemstyle horizontalpadding="10" />

Пожалуйста, дайте мне знать, как я могу дать место между пунктами меню?

Мой код::

 <asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" 
           EnableViewState="False" IncludeStyleBlock="False" Orientation="Horizontal" 
           BackColor="#F7F6F3" DynamicHorizontalOffset="2" Font-Names="Verdana" 
           Font-Size="0.8em" ForeColor="#7C6F57" StaticSubMenuIndent="10px">
      <DynamicHoverStyle BackColor="#7C6F57" ForeColor="White" />
      <DynamicMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
      <DynamicMenuStyle BackColor="#F7F6F3" />
      <DynamicSelectedStyle BackColor="#5D7B9D" />
      <staticmenuitemstyle horizontalpadding="10" />
      <Items>
          <asp:MenuItem NavigateUrl="~/WebPages/Default.aspx"  Text="Support1">
          <asp:MenuItem NavigateUrl="~/WebPages/Default2.aspx"  Text="Support2">
      </Items>
</asp:Menu>

1 ответ

Решение

Вы можете использовать CSS-селекторы, чтобы достичь этого

В своем коде вы присвоили CssClass приписать к вашему Menu контроль. Используйте этот класс CSS под названием "menu" и переопределите его на своей странице (вы можете переместить его позже в файл CSS). Так что добавьте это на свою страницу в <head>

<style type="text/css">
    .menu li ~ li
    {
        padding-left: 100px; /* selects every <li> element that are preceded by a <li> element. */
        list-style:none;
    }

    .menu ul > li:first-child
    {
        font-size:20px;/* this one will select the first element of your menu */
    }
</style>

Обратите внимание, что я добавил .menu ul > li:first-child селектор, чтобы вы не получили левого отступа для первого элемента меню, я просто изменил font-size чтобы дать вам пример контроля, который предоставляют селекторы CSS. Вы можете удалить его, если хотите.

Надеюсь, это поможет вам

Другие вопросы по тегам