Форум программистов CodeGuru
20 Сентябрь 2018, 14:24:20 *
Добро пожаловать, Гость. Пожалуйста, войдите или зарегистрируйтесь.

Войти
Новости:
 
   Начало   Помощь Войти Регистрация  
Страниц: [1]   Вниз
  Печать  
Автор Тема: Столбцы на DIV. Подскажите пожалуйста!  (Прочитано 21409 раз)
0 Пользователей и 1 Гость смотрят эту тему.
Nicht
Интересующийся
**
Офлайн Офлайн

Сообщений: 11


Просмотр профиля
« : 17 Сентябрь 2008, 01:38:41 »

Здравствуйте!

Я много читал про так называемую верстку элементами DIV. Фокус заключается в том что в данном методе таблицы не используются. Это современный способ. Пишут что новые сайты верстают обычно так. Такие приемы уменьшают сами страницы а также хорошо влияет на поисковые системы.
Но вот я столкнулся с проблемой.
Я хочу сделать две колонки элементами DIV. При помощи таблиц я легко делаю две колонки.
Код:
<table border="0" width="100%" cellspacing="0" cellpadding="3">
<tr>
  <td bgcolor="red" width="166">Меню</td>
  <td bgcolor="green">Информация</td>
</tr>
</table>
Сколько бы не было текста в колонках а таблица увеличивается на сколько нужно.

Вот теперь мне хочется получить такие же солбцы на DIV.
Я нашел по поиску несколько примеров и немного переделал код оттуда. Получилось так.
Код:
<div style="position:absolute;width:166;background:red">Меню</div>
<div style="position:absolute;left:166;width:400;background:green">Информация</div>
Но здесь вопервых задана ширина всех столбцов. А мне надо чтобы как у таблицы было на 100%.
А во вторых если в одном div текста больше чем в другом то его нижний край опускается ниже, а нижний край другого div так и остается. А у таблицы в этом случае все столбцы закрашены на одну высоту равномерно.
И еще если я делаю второму столбцу ширину 100% то получается окно с прокруткой.
Неужели надо всегда задавать постоянную ширину у столбцов когда используешь верстку при помощи div?
Или можно сделать и 100%?
Записан
3V
Администратор
Ветеран
*****
Офлайн Офлайн

Сообщений: 1347



Просмотр профиля WWW
« Ответ #1 : 17 Сентябрь 2008, 20:40:48 »

Гм... ну, во-первых, DIV-ы - они и есть DIV-ы, как таблица - не получится.

Сколько бы не было текста в колонках а таблица увеличивается на сколько нужно.
Это не понял. DIV тоже сколько нужно увеличивается.

Вот теперь мне хочется получить такие же солбцы на DIV.
Столбцы - можно. Абсолютно также как у таблицы - не получится.
Элементы могут быть разной высоты.

Но здесь вопервых задана ширина всех столбцов. А мне надо чтобы как у таблицы было на 100%.
DIV изначально "на 100%". Я имею в виду по ширине.

А во вторых если в одном div текста больше чем в другом то его нижний край опускается ниже, а нижний край другого div так и
Упс. Написал выше.
Да, так и будет.

А у таблицы в этом случае все столбцы закрашены на одну высоту равномерно.
Можно исхитриться - смотря что нужно сделать (и, кстати, задача толко в том, чтобы получить 2 колонки "как в таблице" ?).

И еще если я делаю второму столбцу ширину 100% то получается окно с прокруткой.
Ну... значит этот элемент получается шире элемента BODY.
Учитываем, что ширина указывается относительно контейнера.
И неплохо бы привести код проблемный.

Неужели надо всегда задавать постоянную ширину у столбцов когда используешь верстку при помощи div?
Нет.

Или можно сделать и 100%?
Можно.
Записан

c-coder
Пользователь
***
Офлайн Офлайн

Сообщений: 110


Просмотр профиля
« Ответ #2 : 19 Сентябрь 2008, 00:28:19 »

Тоже очень интересно узнать про эту технологию.
Сейчас как раз интересуюсь веб-дизайном.
Записан
Nicht
Интересующийся
**
Офлайн Офлайн

Сообщений: 11


Просмотр профиля
« Ответ #3 : 20 Сентябрь 2008, 12:03:35 »

Так и не получилось сделать столбцами.
Еще нашел примеры где используется float. Но там не столбцы а обтекание текстом того что float.

Форумчане, ну если знаете, подскажите как делать !
Записан
3V
Администратор
Ветеран
*****
Офлайн Офлайн

Сообщений: 1347



Просмотр профиля WWW
« Ответ #4 : 20 Сентябрь 2008, 15:14:19 »

Так и не получилось сделать столбцами.
Примеры чего конкретно не получилось - в студию.

Еще нашел примеры где используется float.
Ну да, css-свойство float тоже можно использовать.

Но там не столбцы а обтекание текстом того что float.
Есть еще свойство clear  Подмигивание

Форумчане, ну если знаете, подскажите как делать !
Гм... готовый рецепт ?
Это смотря что конкретно нужно.
Я как то видел подборку из 54 схем расположения контента в виде столбцов с помощью DIV и CSS (было давно, ссылку точно не найду).

З.Ы. пошукайте по блогам. Блоговые шаблоны сейчас верстаются в основном DIV-ами + там как раз столбцами контент.
З.З.Ы. читайте спецификацию CSS2. Просто читайте и думайте... экспериментируйте... снова читайте... Улыбка
Записан

kirill0072
Пользователь
***
Офлайн Офлайн

Сообщений: 44


Просмотр профиля
« Ответ #5 : 11 Декабрь 2008, 05:43:48 »

А если правому div присвоить
Width: 100%;
padding-left: 166px;
Это не будет отходить от правил хорошего тона???
Записан
holdmann
Пользователь
***
Офлайн Офлайн

Сообщений: 262



Просмотр профиля
« Ответ #6 : 11 Декабрь 2008, 22:47:00 »

че к чему.. все что валидно по w3c, не отходит от правил хорошего тона, имхо...
padding вообще единственное средство, которое я знаю, позволяющее позиционировать контейнеры горизонтально относительно друг друга...
мб, что еще есть Улыбка если кто напишет буду радоваться Улыбка
Записан

Елси вы хотите купить, продать, отремонтировать автомобиль в Ижевске: Вам сюда =)
(c)holdmann
Dozer
Новичок
*
Офлайн Офлайн

Сообщений: 8


Иногда и звери добрые...


Просмотр профиля WWW
« Ответ #7 : 03 Июнь 2009, 12:32:23 »

Вот примерчик использования дивов - без таблиц Улыбка
Записан

Хостим Улыбка
Страниц: [1]   Вверх
  Печать  
 
Перейти в:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.21 | SMF © 2015, Simple Machines Valid XHTML 1.0! Valid CSS!