CSS отмена материнских параметров

Статус
В этой теме нельзя размещать новые ответы.

trooll

PHP кодер
Регистрация
22 Дек 2008
Сообщения
482
Реакции
117
Народ собственно решил создать данную тему так как счел что должно быть актуально и интересно. В инете по этому поводу не чего толкового не нашел.
Ну вот собственно, появился сегодня такой вопрос по поводу работы CSS, а точнее правила дочерних классов.
Вопрос: Как можно отменить параметры материнского класса?

Задача: Задать размер ячейки 100% с id=7. Желательно не используя javascript и неменять изначальных параметров CSS.
Собственно сам пример:
HTML код:
HTML:
<html>
<head>
</head>
<body>
<table class="tbl">
<tr>
<td id="1">1 ячейка</td>
<td id="2">2 ячейка</td>
<td id="3">3 ячейка</td>
<td id="4">4 ячейка</td>
</tr>
<tr>
<td id="5">5 ячейка</td>
<td id="6">6 ячейка</td>
<td id="7">7 ячейка</td>
<td id="8">8 ячейка</td>
</tr>
</table>
</body>
</html>

CSS код:
.tbl {width: 100%;}
.tbl td {width: 20%;}

P.S.: Очень интересно узнать ваше мнение по поводу данной проблемы, и конечно поглядеть решение данной задачи.
P.S.S.: В свою очередь нашел решение (без использования javaskript) но только для своего случая , то есть для таблицы в которой содержаться больше 1 колонки. Решение: Создание Блока из четырех ячеек и объединения их.
 
.tbl td {width: 100%;}
.tbl td#1, .tbl td#2, .tbl td#3, .tbl td#4, .tbl td#5, .tbl td#6 { width: 20%; }
 
Чуток не то, я id проставил для того чтобы указать определенную ячейку (короче не подумав сделал это). В реале будет такой код и ячейку со значением "7 ячейка" нужно сделать размером 100%

HTML:
<html>
<head>
</head>
<body>
<table class="tbl">
<tr>
<td>1 ячейка</td>
<td>2 ячейка</td>
<td>3 ячейка</td>
<td>4 ячейка</td>
</tr>
<tr>
<td>5 ячейка</td>
<td>6 ячейка</td>
<td>7 ячейка</td>
<td>8 ячейка</td>
</tr>
</table>
</body>
</html>

CSS код:
.tbl {width: 100%;}
.tbl td {width: 20%;}

P.S.: Извеняюсь неверно указал HTML код в первом посту, грубо говоря затупил:)
 
без js нереально
 
А что мешает поставить уникальный id 7 ячейке?

<td id="td7">7 ячейка</td>

а в css прописать
.tbl #td7 {width: 100%;}

ЗЫ А если проверить на практике, то что хочет ТС это полный бред .

Как можно растянуть 7 ячейку без 3?
 
вообще как можно 7 сделать 100%, куда 100 если рядом еще... - это 5,6,8 = 0px
проще colspan поставить сразу и все

Код:
<html>
<head>
</head>
<body>
<table class="tbl">
<tr>
<td>1 ячейка</td>
<td>2 ячейка</td>
<td>3 ячейка</td>
<td>4 ячейка</td>
</tr>
<tr>
<td colspan="4">7 ячейка</td>
</tr>
</table>
</body>
</html>

Решение: Создание Блока из четырех ячеек и объединения их.
это как:D
я сделал одну, да и то на 80% получится, отдельно отрибуты прописать если для 7... проще сделать 5 ячеек в строку и пусть 5 будет пустая или с болванкой
 
вообще как можно 7 сделать 100%, куда 100 если рядом еще... - это 5,6,8 = 0px
проще colspan поставить сразу и все

Да это вариант, так проблему решил я в своем случае.

Но я же тему веду не к этому, таблицу я привел для примера. Существует множество других примеров где встречеаться данная проблема, в некоторых вариантах можно прописать id, накрыть javaskript-om, где то объятдениь ячейки, в ставить новый элемент либо запечатать его в другой и т.д..

Вот в принципе хочется узнать есть ли какой ни будь единый статический способ отмены материнских параметров в дочернем классе, без применения javaskript-a и колдовством над html кодом, что бы достичь результат в верстке.
 
В большинстве случаев (по моему опыту процентах в 95) есть смысл обойтись вообще без таблиц.
слоями удобнее, быстрее и код весит в 20 раз меньше.
див1 див2 див 3 див 4 с флоатом лефт
а вторым рядом див5 шириной 1+2+3+4 или 100% еслли в % ширине от экрана с флоат нон. Или я не так проблеу понял?

P.S. а если табличкой так уж необходимо пользоваться, то тут естественно колспан решает, и не только в этом случае. А материнские параметры отменяются, если их заново прописать дочерним элементам, разве этого недостаточно в данном случае?
 
В большинстве случаев (по моему опыту процентах в 95) есть смысл обойтись вообще без таблиц.
слоями удобнее, быстрее и код весит в 20 раз меньше.
див1 див2 див 3 див 4 с флоатом лефт
а вторым рядом див5 шириной 1+2+3+4 или 100% еслли в % ширине от экрана с флоат нон. Или я не так проблеу понял?

P.S. а если табличкой так уж необходимо пользоваться, то тут естественно колспан решает, и не только в этом случае. А материнские параметры отменяются, если их заново прописать дочерним элементам, разве этого недостаточно в данном случае?

:ay:я тож так думаю :D
 
Статус
В этой теме нельзя размещать новые ответы.
Назад
Сверху