Предыдущая тема :: Следующая тема |
Автор |
Сообщение |
epros Гость
|
Добавлено: Вт Май 06 2003 22:36 Заголовок сообщения: Дизайнерские фокусы с таблицами |
|
|
Говорят, таблицы - один из основных инструментов веб-дизайнера. А я вот что-то в некоторые их аспектвы никак не въеду.
Скажем, хочу я сделать простую вещь: таблицу во всю ширину страницы, в первой строчке которой разместить навигационные ссылки, а вторая строчка должна состоять из одной большой ячейки, внутри которой и будет помещена вся содержательная часть страницы.
Проблемы возникают с красивым размещением навигационных ссылок по длине верхней строчки. Каждая ссылка представляет собой текст: слово или короткую фразу. Требования такие: 1. Все ссылки должны быть однострочными - никаких переносов слов на другую строку. Достигается, вроде бы, с помощью атрибута nowrap для ячейки, в которой лежит ссылка. 2. Соседние ссылки не должны наезжать друг на друга - между ними должно быть некое минимальное расстояние, скажем, 10px. Можно сделать это, поместив между соседними ссылками пустую ячейку фиксированной ширины: <td width=10> </td> 3. Но ссылки не должны и разбегаться далеко друг от друга. Хотелось бы, чтобы они шли от левого края экрана через одинаковые промежутки друг от друга, а справа от них до края экрана оставалось пустое место (например, пустая ячейка).
Вот с этим и трудности. Если не задавать ширину ячеек, они растягиваются пропорционально на всю ширину таблицы (т.е. на ширину экрана). А ячейки со ссылками не должны растягиваться! Они должны иметь ровно ширину текста.
Можно попытаться задать им некую заведомо маленькую ширину. Или в абсолютных единицах - скажем 10px, или относительно - скажем 1%. Но в первом случае возникает перенос слов невзирая на атрибут nowrap, а во втором случае атрибут ширины просто игнорируется - ячейка по-прежнему растягивается и между ссылками возникают ненужные пустоты.
Можно попытаться задать заведомо большой атрибут ширины для правой пустой ячейки, скажем 95%. Но это приводит к сжатию пустых ячеек между ссылками, даже в том случае, если для них указана абсолютная ширина.
Можно для всех ячеек задать процент ширины, но ссылки сами по себе могут иметь разные и непредсказуемые ширины - подбирать бесполезно, а в случае если ссылка не вписывается в отведенную ей ячейку - вся картина разъезжается.
Простое решение - таблица, для которой указана абсолютная ширина. Но мне это не нравится. Не хочется иметь страницу, которая в узком окне будет скроллиться влево-вправо, а в широком будет иметь пустое пространство с боков.
Еще более простое решение - задать промежутки между ссылками не пустыми ячейками определенной ширины, а определенным количеством неразрывных пробелов ( ). Мне это решение не нравится тем, что в зависимости от типа шрифта ширина неразрывных пробелов может здорово варьироваться. И, наконец, что в этом случае остается от таблиц? Возвращаемся к текстовому форматированию?
Есть еще одно очевидное решение: вообще не задавать никаких атрибутов ширины, кроме как для пустых ячеек между ссылками. В этом случае ячейки со ссылками будут иметь ширину их содержимог ... |
|
Вернуться к началу |
|
|
Chipollino Гость
|
Добавлено: Ср Май 07 2003 11:53 Заголовок сообщения: Re: Дизайнерские фокусы с таблицами |
|
|
Можно сделать так: в качестве обёртки - таблица из двух строк - для меню и контента... А меню реализовать ещё одной таблицей, вложенной в верхнюю ячейку... |
|
Вернуться к началу |
|
|
Борис Гость
|
Добавлено: Ср Май 07 2003 18:30 Заголовок сообщения: Re: Дизайнерские фокусы с таблицами |
|
|
>>1. Все ссылки должны быть однострочными - никаких переносов слов на другую строку. Достигается, вроде бы, с помощью атрибута nowrap для ячейки, в которой лежит ссылка.
Еще это можно достичь, если не использовать в словах разделителей, по которым делаются переносы на новую строку. Это пробелы и минусы. Заменяй пробелы неразрывными пробелами ( ), минусы не помню, чем. Те же неразрывные пробелы ставь между ссылками. Примерно так:
<a...>ссылка1</a> <a...>с сылка2</a> ...
А чтобы ссылки занимали примерно одинаковое место используй как дополняющий символ тот же неразрывный пробел. |
|
Вернуться к началу |
|
|
the-Robot
Зарегистрирован: 03.05.2003 Сообщения: 12 Откуда: Иркутск
|
Добавлено: Ср Май 07 2003 18:48 Заголовок сообщения: cellspacing и cellpadding |
|
|
А что про cellspacing и cellpadding забыли?? При чём здесь эти пробелы то? Отступ от содержимого ячейки до рамки и расстояние между ячейками... что ещё нужно то? |
|
Вернуться к началу |
|
|
epros Гость
|
Добавлено: Чт Май 08 2003 11:44 Заголовок сообщения: Помню, но не годится: отступы слева и справа автоматически влекут увеличение высоты строк |
|
|
Да и не спасает это: проблема-то в том, что надписи должны быть слева, а таблица при этом - на всю ширину окна. |
|
Вернуться к началу |
|
|
epros Гость
|
Добавлено: Чт Май 08 2003 11:55 Заголовок сообщения: Точно, спасибо |
|
|
Сделал общую таблицу из двух строк с указанием width=100%, в верхнюю строку вложил однострочную таблице таблицу БЕЗ указания width, а в нижней - весь контент. Смотрится неплохо и вроде всеми имеющимися под рукой браузерами понимается адекватно.
Есть еще такая тонкость: некоторые браузеры оставляют справа пустое место под полосу прокрутки. Это место в 100% ширины страницы не входит, но окрашивается в body bgcolor. Поэтому получается, что навагационная строчка (выделенная другим bgcolor) заканчивается за пять миллиметров от правой границы экрана.
Даже не знаю, стоит ли бороться с такой мелочью. |
|
Вернуться к началу |
|
|
the-Robot
Зарегистрирован: 03.05.2003 Сообщения: 12 Откуда: Иркутск
|
Добавлено: Чт Май 08 2003 19:05 Заголовок сообщения: ой, ну не знаю... |
|
|
ой, ну не знаю...мне кажется это делается всё так элементарно... |
|
Вернуться к началу |
|
|
|