В сотый раз об одном и том же...

В этом весь ум, честь и совесть нашей эпохи... Как однажды было сказано: высота блока в IE известна практически всегда... и равна одному проценту... ©

Вопросик:

Вот есть например куча вложенных списков, и все они с разными точками(буковками/цыферками).

при этом не очень хочестя каждый раз писать <li class="Class">, а хочется так:

Код:

---

<ul class="Class1">
****[*]

****[*]
 *<ul class="Class2">
 *****[*]

 *[/list]
****[/list]

---

Как в таком случае писать таблицу стилей, если заранее не известно какой список в каком будет (т.е. нумерованный в не нумерованном или наоборот)?

Заранее Спасибо [Only registered and activated users can see links. Click Here To Register...].

если нужны циферки, то используем

1. ...

а если в целом, то для установки буллетов я использую наследование.. хотя это зависит от конкретной задачи..

На данный момент у меня есть 4 варианта: точечки, буковки, цыферки и пустой.
Поэтому просто ол не хватит...

Если в таблице стилей написать

Код:

---

ul.Class1 li {list-style:none;}
ul.Class2 li {list-style:circle;}

---

то такой список

Код:

---

<ul class="Class2">
 *[*]

 *[*]
 * *<ul class="Class1">
 * * *[*]

 * *[/list]
 *[/list]

---

будет показываться целиком кружочками, так как li вложенного списка будут наследовать класс внешнего.

можно написать так:

Цитата:

---

ul{
* * list-style:none;
}
ul ul{
* * list-style:circle;
}
ul ul.square{
* * list-style:square;
}
ul ul ul{
* * list-style:disc;
}
ul ul{
* * list-style:circle;
}
и т.д.

---

я думаю, что схема действий ясна..
хотя возможно есть и другой какой-нибудь способ избавиться от лишних классов, но я делаю так.. )

Xepec
Там, где цифры – по семантическим соображениям в любом случае должно быть [list=1].

garA
Прально)
Контекстные селекторы в данном случае – самый оптимальный вариант)

Не красиво получается.
И, если как я говорил "заранее не известно какой список в каком будет", то придется все варианты описывать, т.е. типа такого:

Код:

---

ul.Class1 {}
ul.Class2 {}
ul.Class1 ul.Class2 {}
ul.Class2 ul.Class1 {}

---

Что совсем нету способа присвоить жестко нужный класс или класс непосредственного родителя?

Не определяйте классы для[*]. Определяйте их просто для [list]. Возможно, получится... )

Точно [Only registered and activated users can see links. Click Here To Register...].
Я просто сначала так и попробывал, но не получилось, видать какой-то баг был, ну я и подумал, что к ul это не пременимо [Only registered and activated users can see links. Click Here To Register...].

Спасибо!

Новая задачка [Only registered and activated users can see links. Click Here To Register...]

В ие динамически созданым дивам почему-то не присваивается position: relative;

Подробнее:
Есть формочка заказа, там по строчкам ниаменование и поле для ввода количества. Делаю две маленькие кнопочки "+1" и "-1" (одна над другой) и размещаю их с помощью absolute. Каждая строчка создается динамически (по клавшке) и имеет параметр position:relative;
В ff и опере все ок, но эксплорер как буд-то бы не видит этого релатива и вешает кнопочки на самый верх.

Чего с ним можно сделать?

Заранее спасибо [Only registered and activated users can see links. Click Here To Register...].

Xepec, покажите код.

Ну как-то так

Код:

---

<script language="javascript">
OrderDivCount=0;
function AddOrderDiv(i)
{
****NewDivRow="<select>\n"+
****
****<?
****$InfectionsGroup=&#39;&#39;;
****$result=mysql_query("SELECT * FROM ImmunoCombInfo");
****while ($row = mysql_fetch_array($result)) {
 *echo "\"<option value=&#39;$row[Name]&#39; class=&#39;$row[InfectionsGroup]&#39;>$row[Name]</option>\\n\"+\n";
****}
****?>
****"</select>\n"+
****"<input type=&#39;text&#39; id=&#39;Order"+i+"Text&#39; class=&#39;Text&#39; size=&#39;10&#39; maxlength=&#39;10&#39; value=&#39;0&#39; onkeypress=&#39;javascript: return numbersOnly(event);&#39;>\n"+
****"<input type=&#39;button&#39; class=&#39;OrderPlusMinusButtons&#39; onclick=&#39;javascript: document.getElementById(\"Order"+i+"Text\").value=Math.round(document.getElementById(\"Order"+i+"Text\").value)+1&#39;>\n"+
****"<input type=&#39;button&#39; class=&#39;OrderPlusMinusButtons OrderMinusButton&#39; onclick=&#39;javascript: document.getElementById(\"Order"+i+"Text\").value=Math.max(Math.round(document.getElementById(\"Order"+i+"Text\").value)-1,0)&#39;>\n"+
****"<input type=&#39;button&#39; class=&#39;Button&#39; value=&#39;+&#39; onclick=&#39;javascript: AddOrderDiv(OrderDivCount);&#39;>";
****if (i!=0)
****{
 *NewDivRow+=
 *
 *"<input type=&#39;button&#39; class=&#39;Button&#39; value=&#39;-&#39; onclick=&#39;javascript: document.getElementById(\"Order\").removeChild(document.getElementById(\"Order_"+i+"\"));&#39;>";
****}
****var order = document.getElementById(&#39;Order&#39;);
****var newdiv = document.createElement(&#39;div&#39;);
****newdiv.setAttribute(&#39;id&#39;,&#39;Order_&#39;+i);
****newdiv.setAttribute(&#39;class&#39;,&#39;OrderDiv&#39;);
****newdiv.innerHTML = NewDivRow;
****document.getElementById(&#39;Order&#39;).appendChild(newdiv);
 *
****OrderDivCount++;
}
AddOrderDiv(OrderDivCount);
</script>

---

В итоге добавляет такой див:

Код:

---

<div id="Order_0" class="OrderDiv"><select>
<option class="HIV" value="ВИЧ 1+2 БиСпот">ВИЧ 1+2 БиСпот</option>
...
<option class="Helicobacter" value="Helicobacter Pylori IgG">Helicobacter Pylori IgG</option>
</select>


<input type="text" onkeypress="javascript: return numbersOnly(event);" value="0" maxlength="10" size="10" class="Text" id="Order0Text"/>

<input type="button" onclick="javascript: document.getElementById("Order0Text").value=Math.round(document.getElementById("Order0Text").value)+1" class="OrderPlusMinusButtons"/>

<input type="button" onclick="javascript: document.getElementById("Order0Text").value=Math.max(Math.round(document.getElementById("Order0Text").value)-1,0)" class="OrderPlusMinusButtons OrderMinusButton"/>

<input type="button" onclick="javascript: AddOrderDiv(OrderDivCount);" value="+" class="Button"/>

</div>

---

вот стили:

Код:

---

div.OrderDiv
{
****position: relative;
****margin: 0px 0px 3px 0px;
}

.OrderPlusMinusButtons {
background:#eeeeee *url('/test/img/common/plusone.png') 0 0;
width:19px;
height:9px;
border: 0px;
position: absolute;
left: 360px;
top: 0px;
}

.OrderMinusButton{
background:#eeeeee *url('/test/img/common/minusone.png') 0 0;
top: 11px;
}

* html .OrderPlusMinusButtons{top: 2px;}
* html .OrderMinusButton{top: 13px;}

---

Да, и еще вопрос, как-нибудь можно ускориь обработку событий чекбокса?

Ситуация такая: есть чекбокс у него onchange (или onclick), по которому выполняются вычисления, и обновляется кусочек формочки.
Но, если по нему быстро кликнуть 2 раза, то вычисления выполнятся только один раз и эффект от чекбокса будет в итоге отрицательным. (т.е. он включен, а посчитанно как будто бы выключен.)

С ним что-нибудь можно сделать?

1. Вобщем, судя по симптомам, придется писать в onclick= для input.OrderPlusMinusButtons код, изменяющий позицию элемента. Я бы попробовал так...

2. OnDoubleClick (ondblclick=)?

2. dblclick пробывал - в ие и фф работает, но в опере - нет. Еще варианты [Only registered and activated users can see links. Click Here To Register...]?

1. решилось добавлением строчки: newdiv.style.position=&#39;relative&#39;;
т.е. походу ие не читает таблицу стилей для динамически созданых дивов.

Вопрос по ФФ:
есть код типа:

Код:

---

<div>
<div style="float:right; width:100px;">
[Only registered and activated users can see links. Click Here To Register...]
</div>


text - text - text</p>
</div>

---

ФФ отображает текст в

грамотно (т.е. обтекает флоатнутый див), но сам

занимает по ширине все пространство и находится над div&#39;ом, а главное над <a>. И соответственно на ссылку не нажать.

ИМХО флоатнутый див должен быть сверху, но что-то не работает...

Цитата:

---

Originally posted by Xepec@Jul 19 2007, 13:22
[b]ИМХО флоатнутый див должен быть сверху...

---

Почему?

Ну он и по коду сверху стоит, да и текста там нет?
Так, а что, он должен быть снизу?
И как его наверх пихнуть?

Цитата:

---

Originally posted by Xepec@Jul 19 2007, 15:06
И как его наверх пихнуть?
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]

---

[/quote]
Никак. Потому что он и так наверху. Ерунду какую-то пишете...
Ищите ошибку в других стилевых правилах (как всегда)...

АЛИЛУЯ!!!
Нашел! Все дело в position:relative; у

. Добавил флоату тоже самое и все работает.
Только не понятной все равно осталась причина такого поведения...

ЗЫ Спасибо [Only registered and activated users can see links. Click Here To Register...]!