graf

Всем спасибо, проблема была решена через указывание ячейкам vertical-align: top

Пытаюсь создать таблицу, в которой высота ячейки фиксированная вне зависимости от контента, Для достижения эффекта заворачиваю внутри каждой ячейки div с фиксированной высотой. По идее все что внутри дива должно обрезаться, и на высоту ячейки никак не влиять, и тем не менее почему-то высота ячейки меняется в зависимости от контента внутри дива. Проверял в IE FF и Chrome. Нигде не могу найти обьяснения почему так происходит. <tr style="display: table-row;"> <td style="height: 24px; min-height: 24px; max-height: 24px; overflow: hidden;"> <div class="ecl-grid-cell-inner ecl-border-box" style="overflow: hidden; position: relative; height: 24px; max-height: 24px;">AB2 </div> </td> <td style="height: 24px; min-height: 24px; max-height: 24px; overflow: hidden;"> <div class="ecl-grid-cell-inner ecl-border-box" style="overflow: hidden; position: relative; height: 24px; max-height: 24px;"> </div> </td> <td style="height: 24px; min-height: 24px; max-height: 24px; overflow: hidden;"> <div class="ecl-grid-cell-inner ecl-border-box" style="overflow: hidden; position: relative; height: 24px; max-height: 24px;">null</div> </td> <td style="height: 24px; min-height: 24px; max-height: 24px; overflow: hidden;"> <div class="ecl-grid-cell-inner ecl-border-box" style="overflow: hidden; position: relative; height: 24px; max-height: 24px;"> <button class="defaultButton ecl-border-box" data-submitbutton="false">My button</button> </div> </td> </tr>

То есть z-index не появляется у элементов определенных как position: static? Спасибо, понятно... хотя такое поведение даже не учитывая z-index кажется мне странным

Просто создайте новый файл.html поместите туда эти 2 строчки, и вы поймете о чем я говорю.

Есть для примера 2 блока. <div style="background: green; height: 71px; width: 800px; position: absolute; top: 0; left: 0; z-index: 2;"></div> <div style="color:red; z-index: 999;">bla bla bla</div> По какой-то необьяснимой причине первый блок перекрывает второй закрывая текст, игнорируя z-index. Помогите пожалуйста, что здесь происходит и как с эти бороться? Изначальная идею состояла в том, чтобы поместить несколько бэкграундных изображения под текст.

Помогите пожалуйста новичку в javascript. Исходные данные: Есть основная страница с адресом http://bla.com Есть iframe на этой странице у которого адрес https://bla.com/secure.html (HTTPS). Нужно по клику в iframe вызвать функцию на родительской странице: parent.MyFunction(); Получаю ошибку acceess denied. Поскольку это разные протоколы, то браузер считает что это межсайтовый скриптинг. Что можно сделать в такой ситуации?

Ага, спасибо, помогло. Единственное что плохо, это то что при изменении бордера или размера левой колонки, значения margin-left правой тоже прийдется менять.

Здравствуйте, задача чисто теоретическая, просто не дает мне покоя. Существует блок известной ширины и высоты, допустим такой: <div style="height: 500px; width: 200px; background-color: blue; border-right: 3px solid red"></div> справа от него нужно поместить блок который бы занимал все оставшееся пространство справа, изменял ширину при изменении ширины окна, и имел position: relative т.к. в него нужно будет засунуть небольшой блок с position: absolute. Для того чтобы было понятнее, псевдокод может выглядеть так: <div style="height: 500px; width: 200px; float: left; background-color: blue; border-right: 3px solid red"></div> <div style="height: 500px; width: 'оставшийся_размер_до_края_окна_в_процентах'; position:relative background-color: green; border: 2px solid black;"> <div style="position absolute; width: 100px; height: 40px; left: 10px; top: 20px; background-color: red;"></div> </div> Подскажите пожалуйста, как выполнить такую верстку с резиновым правым блоком на css?

Спасибо огромное, все работает как нужно.

Пытаюсь засунуть картинки img в inline элемент span (или <div style='display:inline'>) с заданной шириной. Оберточный элемент схлопывается, картинки слепляются. Самое интересное что в IE все работает как надо, проблема в firefox и хром. Помогите пожалуйста моей беде... При этом элементы обязательно должны быть строчными, так как я не знаю сколько будет картинок, и они могут перейти на другую строку. Код <span style="width: 200px; border: 1px black solid;"><img src="/img/k.jpg" width="50" height="50"></span> <span style="width: 200px; border: 1px black solid;"><img src="/img/k.jpg" width="50" height="50"></span>

Извините, ступил. Удалите пожалуйста тему...

Хочу чтобы при зажатии кнопки мыши изменялся стиль блока, а при отпускании возвращался обратно. Казалось бы все просто onMouseDown и onMouseUp. Но если зажать лкм и уйти с блока, то возвращения к прежнему состоянию не происходит, и onMouseOut не работает. Как сделать чтобы событие onMouseOut отрабатывало даже для зажатой лкм? P.S. *лкм - левая кнопка мыши. Вот мой код. <script type="text/javascript"> function changebutton(id, state) { var obj=document.getElementById(id).style; if (state == 'down') obj.background = "url('/img/button_pressed.png')"; if (state == 'up') obj.background = "url('/img/button_passive.png')"; if (state == 'out') obj.background = "url('/img/button_passive.png')"; } </script> <div class="photobutton" onMouseDown="changebutton('buttonleft', 'down');" onMouseUp="changebutton('buttonleft', 'up');" onMouseOut="('buttonleft', 'out');" id="buttonleft"></div>

Извиняюсь, запутался. Уже все работает, всем спасибо. Если кто-то столкнулся с той-же проблемой, вот примерный рабочий вариант того что мне было нужно: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <table width="100%" border="1" style="table-layout: fixed"> <col><col width="47"><col width="37"> <tr> <td colspan="3">Let me show you somthing</td> </tr> <tr> <td>A</td> <td>B</td> <td><IMG src="icons/edit32x32.png"></td> </tr> </table>

Все равно ничего не получается :-( IE после картинки 32x32 оставляет очень много пустого места в ячейке <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <table width="100%" border="1" class="table-layout: fixed"> <col> <col width="47"> <col width="37"> <tr> <td colspan="3">Let me show you somthing</td> </tr> <tr> <td>A</td> <td>B</td> <td><IMG src="icons/edit32x32.png" border="1"></td> </tr> </table> P.S. где можно почитать про приведение тегов к доктайпу?

К сожалению ничего не помогло :-( Что еще можно сделать?

Вот пример таблицы <table width="100%" border="1"> <tr> <td colspan="3">Let me show you somthing</td> </tr> <tr> <td>A</td> <td width="32">B</td> <td width="32">C</td> </tr> </table> Во всех браузерах которых проверял, все нормально, а в IE ячейки вместо width=32 сбиваются на неизвестную величину. Подскажите пожалуйста варианты решения. P.S. Версия IE 8.0