проблема совместимости браузера - PullRequest
Новая
       9

проблема совместимости браузера

0 голосов
/ 03 сентября 2010

см. Код ниже .. 

 <div style="overflow:auto;width:250px;height:75px;border:1px solid #336699;padding-left:5px">
<label style="{width:250px;}"><input type="checkbox" name="wow[]" onclick='highlight_div(this);'> PHP</label><br>
<label style="{width:250px;}"><input type="checkbox" name="wow[]" onclick='highlight_div(this);'> LINUX</label><br>
<label style="{width:250px;}"><input type="checkbox" name="wow[]" onclick='highlight_div(this);'> APACHE</label><br>
<label style="{width:250px;}"><input type="checkbox" name="wow[]" onclick='highlight_div(this);'> MYSQL</label><br>
<label style="{width:250px;}"><input type="checkbox" name="wow[]" onclick='highlight_div(this);'> POSTGRESQL</label><br>
<label style="{width:250px;}"><input type="checkbox" name="wow[]" onclick='highlight_div(this);'>SQLITE</label><br> </div>

<script>
function highlight_div(checkbox_node)
{
    label_node = checkbox_node.parentNode;


    if (checkbox_node.checked)
    {
        label_node.style.backgroundColor='#0a246a';
        label_node.style.color='#fff';
    }
    else
    {
        label_node.style.backgroundColor='#fff';
        label_node.style.color='#000';
    }
}
</script>

это список, в котором показаны записи, в которых пользователь может выбрать несколько записей ... когда он щелкает запись, выделенная строка выделяется синим цветом для всей строки записи ... эта подсветка работает только в IE, а не в MOZILLA ... В mozilla она подсвечивается частично .. Ватс обходной путь для этого ...

помогите пожалуйста заранее спасибо ....

Ответы [ 3 ]

0 голосов
/ 03 сентября 2010

похоже, что в Firefox <label> является встроенным элементом, в то время как в т. Е. Это блочный элемент (блочные элементы в основном имеют ширину 100% с разрывом строки после).

, поэтому исправление состоит в том, чтобы сделать метки блочными элементами с помощью css: 

label {
    display: block;
}

и избавьтесь от <br> s, так как они вам больше не нужны, проверьте здесь .

0 голосов
/ 03 сентября 2010

Почему вы устанавливаете фигурные скобки поверх стиля?- <label style="{width:250px;}">?Вы должны использовать <label style="width:250px;">

0 голосов
/ 03 сентября 2010 
<div style="overflow:auto;width:250px;height:75px;border:1px solid #336699;padding-left:5px"><label style="{width:250px;}"><input type="checkbox" name="wow[]" onclick='highlight_div(this);'> PHP</label><br><label style="{width:250px;}"><input type="checkbox" name="wow[]" onclick='highlight_div(this);'> LINUX</label><br></div> <script>function highlight_div(checkbox_node){  label_node = checkbox_node.parentNode;   if (checkbox_node.checked){label_node.style.backgroundColor='#0a246a'; label_node.style.color='#fff';} else    {label_node.style.backgroundColor='#fff';label_node.style.color='#000'; }}</script>
...