Селектор последнего ребенка с рамкой все еще остается подчеркнутым - PullRequest
Новая
       16

Селектор последнего ребенка с рамкой все еще остается подчеркнутым

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

Я был бы очень признателен за помощь.

У меня проблема с разметкой html в asp.net, поэтому приходится обходить стороной. Для Firefox и Opera все идеально, но у Chrome в Safari все еще есть одна проблема.

Я хочу сделать последний тег <th> без границ. Строка заголовка <tr> имеет "ограниченный" класс css. Вот часть css: 

.bordered th
{
    border: 1px solid black;
}

.bordered th:last-child
{
    border: 0px none white;
    border-bottom: 0px none white;    
}

HTML разметка: 

`<table class="bordered" cellspacing="0" border="0" id="ctl00_body_gvTimeTable" style="border-collapse:collapse;">
    <tr style="border-width:0px;">
        <th scope="col">One</th>
        <th scope="col">Two</th>
        <th scope="col">Three</th>
        <th scope="col">&nbsp;</th>
    </tr>`

Но все же последний <th> остается подчеркнутым. В чем проблема?

Ответы [ 3 ]

0 голосов
/ 27 ноября 2011

Попробуйте сгенерировать это значение !important, которое переопределит все ранее заданные стили, а также стили, которые переопределят его позже. 

.bordered th
{
    border: 1px solid black;
}

.bordered th:last-child
{
    border: 0 !important;
    border-bottom: 0 !important;
}
0 голосов
/ 27 ноября 2011

Я проверил это в jsFiddle . Я не смог увидеть ни проблем ни в Chrome (версия 15), ни в Safari (версия 5).

Я внес небольшую корректировку в ваш CSS (изменил значения границ на ноль - как предложено Переполнение стека ): 

.bordered th { border: 1px solid black; }
.bordered th:last-child { border: 0; border-bottom: 0; }

На что обратить внимание: last-child - это CSS3 селектор . Это означает, что он не будет работать в IE8 или ниже (если вы не используете Selectivizr или аналогичный).

0 голосов
/ 27 ноября 2011

:last-child выберет последний дочерний элемент целевого родителя (в данном случае .bordered th).Вам нужно будет использовать что-то вроде th:last-of-type.

...