CSS заполнение ячеек таблицы, интервалы - PullRequest
1 голос
/ 05 февраля 2011
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/1998/REC-html40-19980424/strict.dtd">
<html>
  <head>
    <style type="text/css">
      table {
       border: 0;
       padding: 0; 
       border-collapse: collapse;
      }
      td {padding: 0}
    </style>
  </head>
  <body>
    <table bgcolor="gray" width="100%">
      <tr>
        <td bgcolor="black" height="14px">
          <img src="_images/top_top_line.png" width="800px" height="14px" border="0" alt="">
        </td>
      </tr>
      <tr>
        <td height="14px">
          <img src="_images/top_top_line.png" width="800px" height="14px" alt="">
        </td>
      </tr>
   </table>
  </body>
</html>

В последней опере и ie8 я вижу: http://eta.name/timages/padding.png

Если я удаляю объявление DOCTYPE в Opera, то все в порядке, но в ie ничего не меняется.

Как правильно удалить прокладку?

Я упростил пример: http://eta.name/padding.html Есть проблема TD. Один пиксель сверху и несколько снизу в ячейке. Как это убрать?

Ответы [ 2 ]

1 голос
/ 05 февраля 2011

Это не заполнение. Изображения являются встроенными элементами, поэтому они рассматриваются как буквы. По умолчанию vertical-align установлен так, что нижняя часть изображения совпадает с нижней частью букв, таких как a, b, c и d. Это оставляет место для спусков, которые вы найдете на буквах, таких как j, g, p и y.

Вы можете вертеть с помощью свойства vertical-align, но вы не должны просто использовать таблицы для макета .

0 голосов
/ 05 февраля 2011

Я бы подошел к этому по-другому.Вместо того, чтобы сражаться с каждым браузером, подобным этому, используйте сброс CSS, чтобы иметь полный контроль над всеми элементами и свободно создавать стили по своему желанию.Лучшее, что я знаю, это Эрик Майер http://meyerweb.com/eric/tools/css/reset/

...