В этом весь ум, честь и совесть нашей эпохи... Как однажды было сказано: высота блока в IE известна практически всегда... и равна одному проценту... ©
В этом весь ум, честь и совесть нашей эпохи... Как однажды было сказано: высота блока в IE известна практически всегда... и равна одному проценту... ©
Вопросик:
Вот есть например куча вложенных списков, и все они с разными точками(буковками/цыферками).
при этом не очень хочестя каждый раз писать <li class="Class">, а хочется так:
Как в таком случае писать таблицу стилей, если заранее не известно какой список в каком будет (т.е. нумерованный в не нумерованном или наоборот)?Код:<ul class="Class1"> ****[*] ****[*] *<ul class="Class2"> *****[*] *[/list] ****[/list]
Заранее Спасибо.
если нужны циферки, то используем
- ...
а если в целом, то для установки буллетов я использую наследование.. хотя это зависит от конкретной задачи..
На данный момент у меня есть 4 варианта: точечки, буковки, цыферки и пустой.
Поэтому просто ол не хватит...
Если в таблице стилей написать
то такой списокКод:ul.Class1 li {list-style:none;} ul.Class2 li {list-style:circle;}
будет показываться целиком кружочками, так как li вложенного списка будут наследовать класс внешнего.Код:<ul class="Class2"> *[*] *[*] * *<ul class="Class1"> * * *[*] * *[/list] *[/list]
можно написать так:
я думаю, что схема действий ясна..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]. Возможно, получится... )
Точно
Я просто сначала так и попробывал, но не получилось, видать какой-то баг был, ну я и подумал, что к ul это не пременимо
Спасибо!
Новая задачка
В ие динамически созданым дивам почему-то не присваивается position: relative;
Подробнее:
Есть формочка заказа, там по строчкам ниаменование и поле для ввода количества. Делаю две маленькие кнопочки "+1" и "-1" (одна над другой) и размещаю их с помощью absolute. Каждая строчка создается динамически (по клавшке) и имеет параметр position:relative;
В ff и опере все ок, но эксплорер как буд-то бы не видит этого релатива и вешает кнопочки на самый верх.
Чего с ним можно сделать?
Заранее спасибо
Xepec, покажите код.
Ну как-то так
Код:<script language="javascript"> OrderDivCount=0; function AddOrderDiv(i) { ****NewDivRow="<select>\n"+ **** ****<? ****$InfectionsGroup=''; ****$result=mysql_query("SELECT * FROM ImmunoCombInfo"); ****while ($row = mysql_fetch_array($result)) { *echo "\"<option value='$row[Name]' class='$row[InfectionsGroup]'>$row[Name]</option>\\n\"+\n"; ****} ****?> ****"</select>\n"+ ****"<input type='text' id='Order"+i+"Text' class='Text' size='10' maxlength='10' value='0' onkeypress='javascript: return numbersOnly(event);'>\n"+ ****"<input type='button' class='OrderPlusMinusButtons' onclick='javascript: document.getElementById(\"Order"+i+"Text\").value=Math.round(document.getElementById(\"Order"+i+"Text\").value)+1'>\n"+ ****"<input type='button' class='OrderPlusMinusButtons OrderMinusButton' onclick='javascript: document.getElementById(\"Order"+i+"Text\").value=Math.max(Math.round(document.getElementById(\"Order"+i+"Text\").value)-1,0)'>\n"+ ****"<input type='button' class='Button' value='+' onclick='javascript: AddOrderDiv(OrderDivCount);'>"; ****if (i!=0) ****{ *NewDivRow+= * *"<input type='button' class='Button' value='-' onclick='javascript: document.getElementById(\"Order\").removeChild(document.getElementById(\"Order_"+i+"\"));'>"; ****} ****var order = document.getElementById('Order'); ****var newdiv = document.createElement('div'); ****newdiv.setAttribute('id','Order_'+i); ****newdiv.setAttribute('class','OrderDiv'); ****newdiv.innerHTML = NewDivRow; ****document.getElementById('Order').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 пробывал - в ие и фф работает, но в опере - нет. Еще варианты
1. решилось добавлением строчки: newdiv.style.position='relative';
т.е. походу ие не читает таблицу стилей для динамически созданых дивов.
Вопрос по ФФ:
есть код типа:
ФФ отображает текст вКод:<div> <div style="float:right; width:100px;"> [Только зарегистрированные пользователи могут видеть ссылки. ] </div> text - text - text</p> </div>
грамотно (т.е. обтекает флоатнутый див), но сам
занимает по ширине все пространство и находится над div'ом, а главное над <a>. И соответственно на ссылку не нажать.
ИМХО флоатнутый див должен быть сверху, но что-то не работает...
Почему?Originally posted by Xepec@Jul 19 2007, 13:22
[b]ИМХО флоатнутый див должен быть сверху...
Ну он и по коду сверху стоит, да и текста там нет?
Так, а что, он должен быть снизу?
И как его наверх пихнуть?
АЛИЛУЯ!!!
Нашел! Все дело в position:relative; у
. Добавил флоату тоже самое и все работает.
Только не понятной все равно осталась причина такого поведения...
ЗЫ Спасибо
Ваши права
