HTML-ячейка, содержащая полосы прокрутки css - как избавиться от отступов? - PullRequest
Новая
       46

HTML-ячейка, содержащая полосы прокрутки css - как избавиться от отступов?

1 голос
/ 20 января 2010

У меня есть таблица HTML, где каждая ячейка содержит большой объем данных. Мне бы хотелось, чтобы каждая ячейка могла прокручиваться по отдельности (что-то вроде «панелей»), поэтому я создал класс CSS, который включает атрибут overflow: scroll. Однако ширина не одинакова для каждого использования CSS-класса. Это вызывает проблему заполнения ячейки. Когда ширина определена во внешней таблице стилей (что не работает для меня, поскольку мне нужно иметь возможность устанавливать разные ширины), «панель» заполняет всю ячейку, но когда я определяю ее на уровне ячейки внутри ячейки есть прокладка.

Вот определение класса: 

.imitationPane{
    display: block;
    border-width: 1px;
    border-style: solid;
    border-color: 000;
    margin-top: 5px;
    padding:5px;
    height: 200px;
    overflow: scroll
 }

Вот HTML-код: 

<table cellpadding=0 cellspacing=2 border=1 width=720>
    <tr>
        <td align=left>
            <span class="imitationPane">
    Hello World bjkgkgdtfdfhbvufgfckjgetdkhgytffkgughkhyufrdyufukg<br><br><br>
            </span>
        </td>
        <td align=left>
            <span class="imitationPane">
    Hello World bjkgkgdtfdfhbvufgfckjgetdkhgytffkgughkhyufrdyufukg<br><br><br>
<h1>AGAIN</h1>
            </span>
        </td>
    </tr>
    <tr>
        <td align=left>
            <span class="imitationPane">
    Hello World bjkgkgdtfdfhbvufgfckjgetdkhgytffkgughkhyufrdyufukg<br><br><br>
<h1>CELL 3</h1>
            </span>
        </td>
        <td align=left>
            <span class="imitationPane">
    Hello World bjkgkgdtfdfhbvufgfckjgetdkhgytffkgughkhyufrdyufukg<br><br><br>
<h1>CELL 4</h1>
            </span>
        </td>
    </tr>
</table>

Ответы [ 2 ]

1 голос
/ 20 января 2010

Я решил это через одну минуту после публикации, хотя работал над этим несколько часов. Фактическая проблема заключалась в том, что, когда ширина таблицы была больше, чем сумма ширин каждой отдельной ячейки (или охватываемой области), появлялось заполнение ячейки. По совпадению, я пробовал только большие числа во внешней таблице стилей, а маленькие - в реальном коде, поэтому оказалось, что проблема была в том, где были данные, а не в том, ЧЕМ данные были

0 голосов
/ 21 января 2010

Хорошо, чтобы добавить что-то к этому, при быстром просмотре может иметь смысл применить свойство scroll к таблице td вместо тегов span. Логически тогда, когда содержимое ячейки превышает заданные размеры, оно переполняется, и вы запрашиваете, чтобы переполнение отображалось как прокрутка .... атрибуты, которые вы определяете в своем CSS, кажутся более подходящими для элементов таблицы, чем для span .... но, конечно, вы знаете свои потребности лучше всего.

...