CSS-селектор не разрешен при использовании пользовательского интерфейса Binder - PullRequest
Новая
       13

CSS-селектор не разрешен при использовании пользовательского интерфейса Binder

4 голосов
/ 25 ноября 2011

По сути, я строю горизонтальную панель навигации. У меня есть следующая разметка: 

<ui:style src="../common.css" type="client.resources.HomeResources.Style">
    @external gwt-Anchor;
    .gwt-Anchor {
        text-decoration: none;
    }
</ui:style>
<g:HTMLPanel styleName="navbar">
    <ul>
        <li><g:Anchor ></g:Anchor> |</li>
        <li><g:Anchor ></g:Anchor> |</li>
        <li><g:Anchor ></g:Anchor> |</li>
        <li><g:Anchor ></g:Anchor> |</li>
        <li><g:Anchor ></g:Anchor> |</li>
        <li><g:Anchor ></g:Anchor> |</li>
        <li><g:Anchor ></g:Anchor></li>
    </ul>

common.css имеет следующие правила: 

ul {
    margin: 0;
    padding: 0;
    text-align: left;
    font-weight: bold;
    line-height: 25px;
}

ul li {
    display: inline;
    text-align: right;
}

ul li a {
    color: #0077C0;
    font-size: 12px;
    margin-right: 15px;
    padding: 4px 0 4px 5px;
    text-decoration: none;
}

ul li a:HOVER {
    color: #F0721C;
}

При использовании правил, определенных выше, все работает идеально. Проблема в том, что у меня есть ul элементов в других частях страницы, поэтому я добавил div.navbar перед каждым правилом, как это: 

div.navbar ul{}
div.navbar ul li{}
etc...

Но эти правила не применяются к ul элементам внутри шаблона пользовательского интерфейса. Что не так с моим кодом?

Вот сгенерированный HTML (обычно в одну строку): 

<div class="navbar"><ul>
   <li><a class="gwt-Anchor">Item 1</a> |</li>
   <li><a class="gwt-Anchor">Item 2</a> |</li>
   <li><a class="gwt-Anchor">Item 3</a></li>
</ul></div>

ПОСТАНОВИЛИ

styleName="navbar" должно быть styleName="{style.navbar}"

1 Ответ

1 голос
/ 25 ноября 2011

Я спрашиваю только потому, что вы не включили это в свой пример кода: дважды ли вы проверили, есть ли <div class="navbar">, обертывающий ul?

Кроме того, если <g:HTMLPanel styleName="navbar"> генерирует div, он не будет закрыт в предоставленном вами коде. Может быть, вам нужен </g:HTMLPanel?

...