Xpoint
   [напомнить пароль]

Проблема с отображением таблицы в разных браузерах

Метки: [без меток]
2005-10-22 06:31:26 [обр] Polo[досье]

На днях скачал к своему ослу на всяких случай FF и оперу и открыв какой-то файл с какой-то простенькой табличкой ужаснулся... Особенно "порадовала" опера, т.к. самая "красивая" таблица получилась именно там. В FireFox все нормально, но от IE табличка в некоторых местах отличалась. В связи с этим появились некоторые вопросы:

  1. В IE ставлю кнопочке border: 0, но все равно вокруг нее однопиксельная черная рамка. Как-то от нее можно избавиться? В FF и опере ее нет...
  2. Если в ячейке прописать style='font-face: Veranda', то FF никак не реагирует, а если сделать class='...', то работает... В чем дело? Или я ошибаюсь?
  3. Теперь по поводу самой таблички. Вот ее код:

    <table cellspacing='0' cellpadding='2'>
    <tr>
<td height='20' style='border: #000 1pt solid' colspan=3>Text</td>
  </tr>
  <tr>
<td colspan='3' style='border-left: 1px #000 solid; border-right: 1px #000 solid'>
<input type='text' style='width: 40pt'>
<input type='text' style='width: 40pt'>
<input type='text' style='width: 40pt'>
<input type='submit' value='...'>
</td>
   </tr>
   <tr>
<td style='border-left: 1px #000 solid; width: 10pt'>&nbsp;</td>
<td height='50' style='border: 1px #000 solid' id='TEST' bgcolor='green'>&nbsp;</td>
<td width='10' style='border-right: 1px #000 solid'>&nbsp;</td>
   </tr>
   <tr>
<td colspan='3' style='border: 1px #000 solid; border-top: 0'>
<input type='checkbox'>Text<br>
<input type='checkbox'>Text<br>
</td>
  </tr>
    </table>

Проблема в том, что ы получившийся в центре зеленый прямоуголиник (ячейка с ID=TEST) скрипт добавляет некий html-код неопределенного размера и эта ячейка должна подгоняться под размер текста... Впринципе в приведенном выше примере так и происходит, но по задумке эта самая ячейка должна отставать от боковых краев на 10px, для этого по бокам расположены 2 ячейки. Но если центральной ячейке указать размер, то html-код добавляется некорректно, тоесть только на указанный размер, а мне как я уже говорил нужно, чтобы ячейка и соответственно вся таблица подгонялась под текст. FireFox отображает примерно то, что мне нужно, а вот IE и опера не хотят... Возможно все очень просто, но что-то ничего в голову не приходит...

спустя 3 часа 32 минуты [обр] Lynn «Кофеман»(0/571)[досье]
  1. Может не Veranda, а Verdana?
спустя 29 минут [обр] Lynn «Кофеман»(0/571)[досье]

Не совсем понял, что надо.

HTML:

<table>
   <tr>
      <td id='top'>Text</td>
   </tr>
   <tr>
      <td>
         <input type='text' class='text'>
         <input type='text' class='text'>
         <input type='text' class='text'>
         <input type='submit' value='...'>
      </td>
   </tr>
   <tr>
      <td id='test'>some text</td>
   </tr>
   <tr>
      <td>
         <input type='checkbox'>Text<br>
         <input type='checkbox'>Text<br>
      </td>
   </tr>
</table>

CSS:

table {
   border-collapse: collapse;
   border: 1px solid black;
}
td {
   padding: 2px;
}
td#top {
   border-bottom: 1px solid black;
}
input.text {
   width: 40pt;
}
#test {
   vertical-align: top;
   padding: 2px 10px;
   height: 50px;
}
спустя 1 час 53 минуты [обр] Polo[досье]
Это не совсем то что нужно. Нужно чтобы ячейка (которая id=test, зеленая) была прямоуголиником внутри основного прямоуголиника... Чтобы боковые грани этой внутренней ячейки отставали от боковых граней внешней примерно на 10px... Не знаю насколько уж я доступно объясняю...
Должно быть примерно как мой пример, если его просматривать через FireFox, только чтобы было также и в других браузерах.
спустя 21 час [обр] Lynn «Кофеман»(0/571)[досье]

Заменяем в HTML <td id='test'>some text</td> на <td><div id='test'>some text</div></td>

Заменяем в CSS

#test {
   vertical-align: top;
   padding: 2px 10px;
   height: 50px;
}

на

#test {
   margin: 0 8px;
   _height: 50px;
   min-height: 50px;
   background: #9f9;
}
спустя 1 час 6 минут [обр] Polo[досье]
Вненешне это то что нужно, спасибо, но в силе остается другая проблема: когда скрипт добавляет в этот div какой-то текст, то по задумке div и соответственно вся таблица должны автоматически расширяться, а сейчас текст переносится на другую строку... В лисе работает как надо, а вот в опере и осле хотелось бы как то исправить.
спустя 1 час 33 минуты [обр] Lynn «Кофеман»(0/571)[досье]
http://boook.no-ip.info:8888/_/a.html
Понажимайте не кнопку „add“. У меня в IE 5.5, IE 6 и FF 1.0.7 таблица расширяется.
спустя 51 минуту [обр] Polo[досье]
Да действительно все работает, это была моя ошибка, зачем-то указал ширину одной из ячеек. Большое спасибо.
Powered by POEM™ Engine Copyright © 2002-2005