>Форум Mozilla Россия
   http://forum.mozilla-russia.org/index.php
>Проблемы с сайтами
   http://forum.mozilla-russia.org/viewforum.php?id=24
>Ячейки таблицы воспринимают указание размеров только по вертикали.
   http://forum.mozilla-russia.org/viewtopic.php?id=18276

ShadyAngel > 30-07-2007 06:24:16

Ячейки таблицы воспринимают указание размеров только по вертикали. Ниже код примера. У меня во всех браузерах по высоте устанавливается высота яейки в 100 пиксел и появляется полоска прокрутки, а по ширине таблица упихмвается в див! Как этого избежать? Мне нужно точно указывать размеры ячеек.


<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
  <style>
  .scrollt td{width: 100px; height: 100px;}
  </style>
</head>
<body>
   <div style="width: 300px; height: 300px; background-color: #F00; overflow: scroll;">
   <table class=scrollt border=1 cellspacing=0>
    <tr><td>1</td>    <td>2</td>    <td>3</td>    <td>4</td>    <td>5</td>    <td>6</td></tr>
    <tr><td>7</td>    <td>8</td>    <td>9</td>    <td>10</td>    <td>11</td>    <td>12</td></tr>

    <tr><td>1</td>    <td>2</td>    <td>3</td>    <td>4</td>    <td>5</td>    <td>6</td></tr>
    <tr><td>7</td>    <td>8</td>    <td>9</td>    <td>10</td>    <td>11</td>    <td>12</td></tr>

    <tr><td>1</td>    <td>2</td>    <td>3</td>    <td>4</td>    <td>5</td>    <td>6</td></tr>
    <tr><td>7</td>    <td>8</td>    <td>9</td>    <td>10</td>    <td>11</td>    <td>12</td></tr>
   </table>
   </div>
</body>
</html>

Shutnik > 31-07-2007 09:09:09

ShadyAngel

во первых

Выделить код

Код:

.scrollt td{width: 100px; height: 100px;}

меняем на

Выделить код

Код:

td.scrollt {width: 100px; height: 100px;}

а во вторых, разбирайтесь с размерами, что-то вы запутались похоже

ShadyAngel > 31-07-2007 11:45:02

.scrollt td{width: 100px; height: 100px;} обозначает "все ячейки (элементы TD) внутри элемента класса scrollt имеют размер сто на сто". Максимум что здесь можно добавить это table.scrollt td{бла-бла}. То что предлагаете вы  означает "все элементы TD класса scrollt имею размет сто на сто". В написанном мной примере нет элементов TD класса scrollt.

Суть проблемы такова: есть таблица с яцейками сто на сто, она прекрасно отображается, вот пример.

<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
  <style>
  .scrollt td{width: 100px; height: 100px;}
  </style>
</head>
<body>
    <table class=scrollt border=1 cellspacing=0>
    <tr><td>1</td>    <td>2</td>    <td>3</td>    <td>4</td>    <td>5</td>    <td>6</td></tr>
    <tr><td>7</td>    <td>8</td>    <td>9</td>    <td>10</td>    <td>11</td>    <td>12</td></tr>

    <tr><td>1</td>    <td>2</td>    <td>3</td>    <td>4</td>    <td>5</td>    <td>6</td></tr>
    <tr><td>7</td>    <td>8</td>    <td>9</td>    <td>10</td>    <td>11</td>    <td>12</td></tr>

    <tr><td>1</td>    <td>2</td>    <td>3</td>    <td>4</td>    <td>5</td>    <td>6</td></tr>
    <tr><td>7</td>    <td>8</td>    <td>9</td>    <td>10</td>    <td>11</td>    <td>12</td></tr>
   </table>
</body>
</html>

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

И где же по вашему я запутался в размерах?

Shutnik > 31-07-2007 13:15:53

понятно.
если добавить к каждому td-элименту первой строки атрибут nowrap, то всё будет именно так, как вы хотели.
как сделать это через css увы не знаю, MDC тоже ;)

Lynn > 09-08-2007 15:36:22

Способ отрисовки таблиц очень сложен по историческим причинам…
Попробуйте

Выделить код

Код:

table {table-layout:fixed}