Table - как избавиться от автоматич. уменьшения ширины при уменьшении размера экрана?
Вот ссылка на мой код, где можно всё попробовать:
http://jsfiddle.net/KT5TC/1/ Table - как избавиться от автоматического уменьшения ширины таблицы при уменьшении размера родит. элемента? Менять ширину элемента можно, наведя мышь на правый его край, далее - зажимаете левую кнопку мыши и меняете размер элемента. 1. Попробуйте уменьшить размер внешнего div (двойная рамка) меньше ширины таблицы - таблица начнёт сжиматься. Тот же эффект Вы достигнете если просто будете уменьшать размер окна браузера. 2. Попробуйте увеличить размер СТОЛБЦА таблицы (хочу менять именно ширину столбцов и чтобы край таблицы при этом менялся автоматически - для таблицы я не задаю WIDTH). Если Вы увеличиваете его так, что край таблицы достигает края внешнего div, то ширина столбца начинает увеличиваться, а таблица пытается остаться на странице полностью, уменьшая ширину других столбцов). 3. Примечательно, что розовый div ведёт себя вполне корректно - если все те же действия применить к нему. http://jsfiddle.net/KT5TC/ - здесь розовый див шире таблицы, чтобы Вы увидели его поведение. ВОПРОС: МНЕ ОЧЕНЬ НУЖНО ЧТОБЫ ТАБЛИЦА ВЕЛА СЕБЯ КАК РОЗОВЫЙ ДИВ В ОБОИХ СЛУЧАЯХ! А именно если она по АВТОМАТИЧЕСКОЙ ширине должна стать больше родительского элемента - чтобы становилась и при этом становилась активной полоса прокрутки. И НЕ ИСПОЛЬЗОВАТЬ ДЛЯ ЭТОГО ДОПОЛНЕНИЯ В JS-коде! Можно ли вообще это сделать вёрсткой (css + html)? |
У розового дива фиксированная ширина! (width:350px)
Ты же сам это написал. Если тебе нужно что бы таблица не меняла ширину, нужно или задать width или min-width или конкретный размер ячеек. |
Там видз скриптом задаётся - т.е. сперва его не было, но как только столбец расширяем или уменьшаем- видз устанавливается. При этом таблица всё равно себя безобразно ведёт, на что, собственно, я и жаловался. А вот мин-видз и макс-видз помогло. Но изначально этого не хотел - не хотел менять универсальный скрипт резайс. Впрочем, у всех элементов есть есть мин-видз и макс-видз и поэтому, когда переписал резайс-скрипт (на основе мин-видз и макс-видз) - вроде универсально работает и с дивами и т.п.
Промежуточное решение было - пихнуть в каждый заголовок столбца по диву (поскольку дивы изначально себя правильно ведут). Но такое решение тоже изначально не рассматривал, поскольку это привносит в вёрстку семантически ненужные элементы.... |
|
Простите, не увидел разницы в поведении таблицы. По крайней мере, ещё ширину не удаётся утащить за внешний див - см. пункт 2.
Решение найдено - смотрите: http://jsfiddle.net/KT5TC/15/. |
Тебе просто нужно задать min-width для таблицы, она не будет уменьшаться тогда.
|
Часовой пояс GMT +3, время: 12:03. |