Ячейки внутри таблицы сжимаются, нужно сохранить размер

@insideone · Регистрация: 10.01.2010

Author24 — интернет-сервис помощи студентам

Добрый день! Столкнулся с трудностью, мне нужно поместить таблицу в определенного размера div, так чтобы таблица отобразилась в нем со скроллом. Все бы хорошо, но при этом ячейки ужимаются по ширине. А нужно сохранить и ширину и высоту ячейки

HTML5

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<style>
 
table {
    border-collapse: separate;
    border-spacing: 0px;
    border-spacing: 1px 1px;
}
table td {
    width: 100px;
    height: 100px;
    outline: 1px solid black;
    text-align: center;
    vertical-align: center;
}
div:hover {
    width: 200px;
    height: 200px;
    overflow: scroll;
}
 
</style>
</head>
<body>
    <div>
        <table>
            <tr>
                <td>1</td>
                <td>2</td>
                <td>3</td>
            </tr>
            <tr>
                <td>4</td>
                <td>5</td>
                <td>6</td>
            </tr>
            <tr>
                <td>7</td>
                <td>8</td>
                <td>9</td>
            </tr>
        </table>
    </div>
</body>
</html>

Попробуйте этот код, наведите на таблицу и увидите о том что я говорю. Мне нужно сохранить таблицу, но так чтобы она была внутри сколлящегося div'а

@superpuper · 12.06.2011, 00:37

Может добавить

CSS

1
2
3

table {
        width: 300px;
}

У меня работает.

@insideone · 12.06.2011, 14:31 **[ТС]**

Что ж, вариант. Просто столбцов в таблице может быть разным, т.к. это будет что-то вроде карты и генерящейся на PHP. В принципе можно расчитывать и там, но если кто знает другой вариант буду рад услышать

@superpuper · 12.06.2011, 17:49

А я вот ещё придумал.

CSS

td:before {
    content: '';
    display: block;
    width: 100px;
}

Только для IE придётся экспрешены дописывать.

@insideone 3687 / 964 / 114 Регистрация: 10.01.2010 Сообщений: 2,550
	12.06.2011, 14:31 [ТС]	3
	Что ж, вариант. Просто столбцов в таблице может быть разным, т.к. это будет что-то вроде карты и генерящейся на PHP. В принципе можно расчитывать и там, но если кто знает другой вариант буду рад услышать 0

	12.06.2011, 17:49