HTML+CSS+JavaScript

Можно ли в осле сделать высоту строки таблицы равной 2px? У меня меньше чем 20px не получается :(
Что только не пробовал...

<table align=center cellpadding=0 cellspacing=0 width=980px border=0 style='height:80px; padding:0; margin:0;'> <tr style='height:2px; padding:0; margin:0;'> <td colspan=4 style='height:2px; padding:0; margin:0; background:#f00000;'> <img width=100% src='img/hdrfon2.png' style='height:2px;'> </td> </tr> ....

Получается строка высотой 20px с красным фоном, и посередине строки - рисунок высотой 2px.
Мозила и опера отображают строку именно так, как и нужно: строка высотой 2px, и красный бэкграунд из-под рисунка не виден.

Как заставить осла установить высоту строки 2px?
Спасибо.

Что-то не очень понятно. Если вы хотите чтобы высоту ячейки определял рисунок высотой в 2рх, выбросите все эти стили нафик (у вас прямо в таблице уже прописано - cellpadding=0 cellspacing=0).

Без стилей такая же высота: 20 пикселей. Перепробовал огромное количество вариантов - безрезультатно. Меньге чем 20 - ни в какую...

line-height:0px (1px);
fonnt-size:0px (1px);

Ну что вы говорите? Вот вам таблица, в которую помещено изображение - прозрачный GIF 1х1рх, но взятый по ширине в 100рх. Ячейка таблицы будет иметь по высоте 1рх, оганиченная бордюром (правда это за счет CELLSPACING="1" происходит), проверьте.

<TABLE BGCOLOR="#000000" CELLPADDING="0" CELLSPACING="1">  <TR BGCOLOR="#FFFFFF">   <TD><IMG SRC="pixel.gif" ALT="" WIDTH="100" HEIGHT="1" BORDER="0"></TD>  </TR> </TABLE>

Может быть высоту желаемой ячейки определяет смежная с ней ячейка и вы боретесь с "мельницей"?

Нашёл, в чём дело.
Вот ваш код:

<TABLE BGCOLOR="#000000" CELLPADDING="0" CELLSPACING="0">  <TR BGCOLOR="#FFFFFF">   <TD><IMG SRC="pixel.gif" ALT="" WIDTH="100" HEIGHT="1" BORDER="0"></TD>  </TR> </TABLE>

Строка высотой 1пиксель.

Вот ещё раз ваш код:

<TABLE BGCOLOR="#000000" CELLPADDING="0" CELLSPACING="0">  <TR BGCOLOR="#FFFFFF">   <TD>     <IMG SRC="pixel.gif" ALT="" WIDTH="100" HEIGHT="1" BORDER="0">   </TD>  </TR> </TABLE>

Теперь строка высотой 20 пикселей...

-----------------------------------
Вот мой код:

<table cellpadding='0' cellspacing='0'> <tr> <td> <img src='img/hdrfon2.png' alt='' width='100' height='1' border='0'> </td> </tr> </table>

Высота строки - 1 пиксель

Вот опять мой код:

<table cellpadding='0' cellspacing='0'> <tr style='background:#f00000;'> <td> <img src='img/hdrfon2.png' alt='' width='100' height='1' border='0'> </td> </tr> </table>

Высота строки - 20 пикселей.

А вот третий код:

<table cellpadding='0' cellspacing='0'> <tr style='background:#f00000;line-height:0px;font-size:0px;'> <td> <img src='img/hdrfon2.png' alt='' width='100' height='1' border='0'> </td> </tr> </table>

Высота строки - 1 пиксель


Можно ещё пару вариантов привести, но это уже излишне.

У вас есть объяснение этому? Почему расположение тегов <TD> и </TD> в разных строках кода при наличии бэкграунда приводит к тому, что осел устанавливает минимальную высоту 20 пикселей?
И почему отсутствие бэкграунда позволяет получить высоту 1 пиксель независимо от взаиморасположения тегов <TD> и </TD>?

Я полагаю, что осел, увидев бэкграунд, в обязательном порядке старается показать его цвет. И начинает интерпретировать перенос строки перед </TD> как тег <BR>, во что бы то ни стало пытаясь отобразить бэкграунд. Подтверждение этому - последний код, в котором line-height:0px и font-size:0px; позволяют свести к нулю высоту этого невидимого <BR>

Или это не так? И есть другое объяснение?

И самое интересное: почему мозила и опера не вставляют этот перенос строки?

Вот мой код во второй вашей "инкарнации", но записан смотрите как:

<TABLE BGCOLOR="#000000" CELLPADDING="0" CELLSPACING="0"><TR><TD><IMG  SRC="pixel.gif" ALT="" WIDTH="100" HEIGHT="1" BORDER="0"></TD></TR></TABLE>

И ячейка будет высотоой в 1рх. Записывайте все одной строкой, разбивая ее по пробелам между свойствами элемента.

Это всё понятно, но мне не нравится то, что код получается нечитабельным. Сплошная каша, и никакого форматирования. Сидеть и разбирать строку, отыскивая в ней открывающие и закрыващие теги не очень удобно. А если ещё строка будет несколько сотен символов?
Проще использовать line-height и font-size.

В общем, проблема локализована, спасибо всем за помощь.

Такую "кашу" делают когда в таблицу вставляют картинки, для того чтобы не было разрывов, а их не должно быть и между тегами самой таблицы.