it-swarm.com.ru

Как остановить изменение размера таблицы при увеличении содержимого?

У меня есть table, ячейки которого заполнены картинками. Мне бы хотелось, чтобы картинки увеличивались при наведении на них, и я хотел бы, чтобы ячейки таблицы оставались одинакового размера. 

Изменение стиля img на position:relative не работает. Изменение его на position:absolute работает, но я не знаю абсолютного положения изображений. 

Есть ли элегантное решение этой проблемы с помощью CSS? Я бы предпочел не использовать JavaScript. 

26
Maarten

Используйте style="table-layout:fixed;", но при этом текст или изображения будут перекрываться с другими столбцами, если они превышают ширину. Постарайтесь не размещать длинные текстовые фразы без пробелов.

61
Alex G de A

Используйте table-layout: fixed для своей таблицы и некоторую фиксированную ширину для самой таблицы и/или ее ячеек.

10
Marat Tanalin

Используйте минимальную ширину в своих ячейках, посмотрите пример здесь

.cell1{
display:table-cell;
width:100px;
min-width:100px;
border: 2px dashed #40f;    
}

http://jsfiddle.net/Gueorguip13/avzuadhp/3/

7
Gueorgui

Добавьте vertical-align:top к элементам td.

1
brains911

Вы можете сделать, чтобы вы могли использовать положение, Z-индекс, слева, сверху.

ты должен смотреть на это так,

http://jsfiddle.net/wWTfs/

1
sinanakyazici