Страница 2 из 4 ПерваяПервая 1234 ПоследняяПоследняя
Показано с 21 по 40 из 79

Тема: Шаблон DIV в 3 колонки

  1. #21

    Регистрация
    19.09.2007
    Сообщений
    36
    В коде от Aykroyd присутствует

    margin: 0px auto;
    overflow:hidden;

    опишите, зачем они используются

  2. #22

    Регистрация
    15.11.2006
    Адрес
    Тольятти
    Сообщений
    2,698
    margin: 0px auto; используется для горизонтального центрирования блочного элемента внутри родительского элемента (контейнера)...

    Свойство overflow со значением hidden предназначено для устранения проваливания элементов с float через низ содержащего их контейнера в нормальных браузерах...

  3. #23

    Регистрация
    19.09.2007
    Сообщений
    36
    Уважаемый Aykroyd, видимо я столкнулся с этой проваливанием в самом начале своего знакомства с версткой дивами.

    Взгляните [Только зарегистрированные пользователи могут видеть ссылки. ]
    Есть ли другой вариант кроме overwrite?

    Отдельная тема для этого мной уже создана designforum.ru/topic27003.html

  4. #24

    Регистрация
    19.09.2007
    Сообщений
    36
    Подскажите.

    Если у меня стоит

    #div1 {
    width:100%;
    margin-right:-200px;
    }

    Как сделать, чтобы вложенный див был внутри этих размеров? если 100% ставлю, то он закрывает правую ячейку..

    Задача: сделать внутри div1 две ячейки по 50% от его размера, а не от общего)

    <div id="div1">

    <div>50%</div> <div>50%</div>

    </div>

  5. #25

    Регистрация
    15.11.2006
    Адрес
    Тольятти
    Сообщений
    2,698
    Я не знаю что Вы понимаете под "общим" размером, но по Вашим словам получается "масло маслянное"... Размеры дочерних элементов и так (по умолчанию) всегда считаются от размеров своих родительских элементов...

    закрывает правую ячейку..
    И еще... Забудьте Вы про ячейки... Нет в блочной модели никаких ячеек...

  6. #26

    Регистрация
    22.04.2007
    Адрес
    mx.pp.ru
    Сообщений
    5
    а скрипт где
    script src="js/minmax.js" type="text/JavaScript

  7. #27

    Регистрация
    15.11.2006
    Адрес
    Тольятти
    Сообщений
    2,698
    [Только зарегистрированные пользователи могут видеть ссылки. ]

  8. #28

    Регистрация
    19.09.2007
    Сообщений
    36
    И все-таки, раз есть тема давайте выведем основные шаблоны 3-колоночных сайтов с масштабируемым центральным блоком.

    Честно признаюсь, для меня большая проблема - проваливания из-за превышающего размеры центрального поля в неправильных броузерах.

  9. #29

    Регистрация
    15.11.2006
    Адрес
    Тольятти
    Сообщений
    2,698
    Originally posted by Грин@Oct 21 2007, 00:38
    И все-таки, раз есть тема давайте выведем основные шаблоны 3-колоночных сайтов с масштабируемым центральным блоком.
    <div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]
    [/quote]

    Один такой "основной" шаблон как раз и выведен в этой теме. Немного выше. Причем смею Вас заверить, что там ничего никуда не проваливается... Ни при каких обстоятельствах, ни в правильных браузерах, ни в неправильных...

  10. #30

    Регистрация
    14.10.2007
    Сообщений
    22
    Как сделать что бы левая и правая колонка была одинакового размера по длине? До самого футера.
    У меня правая колонка длиннее левой и в результате левая не дотягивается до футера..
    Верстал по шаблону Aykroyd

  11. #31

    Регистрация
    15.11.2006
    Адрес
    Тольятти
    Сообщений
    2,698
    Вон оно в чем дело... ) Ну так, это уже совсем другая история... Вышеописанный шаблон демонстрирует решение несколько иных задач – в частности, вынос основного контента в коде на самый верх (меняем колонки местами) и поддержку max-width.

    Как сделать что бы левая и правая колонка была одинакового размера по длине?
    Никак. Потому что в CSS нет средств сказать «высота как вот у того другого элемента».
    Но выход есть. Причем весьма известный. И писал я о нем довольно много, правда, в других темах...

    Воспользуйтесь техникой Faux Columns... Не задавайте фоновый цвет или изображения для самих колонок... Для левой колонки задайте фоновое изображение в элементе html, а для правой – в элементе body...

    И будет Вам счастье...

    P.S. Правда, от max-width в данном конкретном случае скорее всего придется отказаться...

  12. #32

    Регистрация
    14.10.2007
    Сообщений
    22
    Прошу извинить меня, но честно говоря не понял...

  13. #33

    Регистрация
    15.11.2006
    Адрес
    Тольятти
    Сообщений
    2,698
    Код:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title>Центр - Левая - Правая</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <style type="text/css">
    * {margin: 0px; padding: 0px;}
    html {background: url(img/bgleft.gif) #CCFFFF repeat-y; height: 100%;}
    body {background: url(img/bgright.gif) repeat-y right top; min-width: 776px; min-height: 100%; position: relative;}
    * html body {height: 100%;}
    
    #header {background: #FFFF99; height: 100px;}
    
    #content {width: 100%; padding-bottom: 70px; overflow: hidden;}
    
    #outer1 {width: 100%; margin-right: -200px; float: left;}
    #outer2 {margin-right: 200px;}
    #outer3 {width: 100%; margin-left: -150px; float: right;}
    
    #main {margin-left: 150px;}
    #news {width: 150px; float: left;}
    #present {width: 200px; float: right;}
    
    #footer {background: #66FFCC; width: 100%; height: 70px; position: absolute; bottom: 0px;}
    * html #footer {bottom: -1px;}
    </style>
    <script src="js/minmax.js" type="text/JavaScript"></script>
    </head>
    
    <body>
    <div id="header">Заголовок</div>
    
    <div id="content">
    
    ****<div id="outer1">
     *<div id="outer2">
     *****<div id="outer3">
     * *<div id="main">Контент</div>
     *****</div>
    
     *****<div id="news">Новости</div>
    
     *</div>
    ****</div>
    
    ****<div id="present">Презентация</div>
    
    </div>
    
    <div id="footer">Футер</div>
    </body>
    </html>

  14. #34

    Регистрация
    14.10.2007
    Сообщений
    22
    Спасибо, за пример, но у меня немножко посложнее ситуация..
    у меня в левую колонку(div) вписана таблица, в таблице только левому столбцу надо сделать bgcolor, Т.е. у левой колонки нет бэка..

  15. #35

    Регистрация
    15.11.2006
    Адрес
    Тольятти
    Сообщений
    2,698
    Originally posted by barmalei@Oct 21 2007, 18:26
    у меня в левую колонку(div) вписана таблица
    <div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]
    [/quote]
    А Вы уверены, что ей там самое место? )

    Originally posted by barmalei@Oct 21 2007, 18:26
    в таблице только левому столбцу надо сделать bgcolor
    <div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]
    [/quote]
    Ну так и сделайте ему фоновый цвет. В чем проблема? Только не атрибутом bgcolor, а при помощи стилевых спецификаций. Если же необходимо, чтобы этот столбец тянулся до самого футера – НЕ делайте ему фоновый цвет. Подложите вместо этого фонового цвета соответствующее фоновое изображение (с необходимым цветом) в элемент html. Хрен редьки не слаще...

    Originally posted by barmalei@Oct 21 2007, 18:26
    Т.е. у левой колонки нет бэка..
    <div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]
    [/quote]
    По Вашему бэк – это обязательно во всю ширину колонки?

  16. #36

    Регистрация
    14.10.2007
    Сообщений
    22
    Я верстал сайт по этому шаблону
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
    <title>Шаблон DIV: 3 колонки, центральная резиновая</title>
    <script type="text/javascript" src="minmax.js"></script>
    <link rel="stylesheet" type="text/css" href="index.css" media="all" />
    </head>
    <body>

    <div id="header">Заголовок
    <div id="container">
    <div id="container-content">
    *
    </div>


    </div>



    </body>
    </html>[/quote]
    У Вас же теперь совершенно другая структура... придеться передалыватЬ?
    Подскажите как бек не на всю ширину сделать?

  17. #37

    Регистрация
    15.11.2006
    Адрес
    Тольятти
    Сообщений
    2,698
    Originally posted by barmalei@Oct 21 2007, 18:46
    Я верстал сайт по этому шаблону
    <div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]
    [/quote]
    А где Вы его взяли?
    В этой теме таких шаблонов (с такой структурой и такими идентификаторами) даже близко не встречалось.

    Originally posted by barmalei@Oct 21 2007, 18:46
    Подскажите как бек не на всю ширину сделать?
    <div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]
    [/quote]
    Вы издеваетесь? )
    У Вас проблема сделать в Фотошопе картинку меньшей ширины?

  18. #38

    Регистрация
    14.10.2007
    Сообщений
    22
    Сдурил так сдурил.. гляжу тема обновилась, думал файл приатаченый автором - теперь эталонный шаблон, его и взял за основу.. Опять верстать :fie: :fie: :fie:
    Я так понимаю в левой и правой колонке - вообще нельзя будет вставлять рисунки?
    Или к примеру, у меня в DIV(правая колонка) вписана таблица, в одной из ячеек таблицы вставлена картинка.
    Это так и останется:
    <table style=&#39;MARGIN-LEFT: 0px; WIDTH: 100%&#39; cellspacing=&#39;0&#39;* * * * cellpadding=&#39;0&#39; border=&#39;0&#39;><tbody>* * * * <tr>* * * * * <td><img src=&#39;images/3r3.jpg&#39; alt=&#39;&#39; width=&#39;200&#39; height=&#39;48&#39; /></td>

  19. #39

    Регистрация
    15.11.2006
    Адрес
    Тольятти
    Сообщений
    2,698
    Originally posted by barmalei@Oct 21 2007, 19:33
    вписана таблица, в одной из ячеек таблицы вставлена картинка
    <div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]
    [/quote]
    Так я и думал...
    Вы наивно полагаете, что если основной каркас сделать блоками, то внутрь можно спокойно продолжать пихать говнотаблицы? )) Боюсь, что дальше я Вам уже не советчик)

    [Только зарегистрированные пользователи могут видеть ссылки. ]

  20. #40

    Регистрация
    19.09.2007
    Сообщений
    36
    Я пытаюсь самый первый приведенный тут Айвкодом шаблон применить, и приходится при широком контентном поле деать большой min-width.
    spbhouse.ru/photogallery.html на ослах совсем плохо работает.

Страница 2 из 4 ПерваяПервая 1234 ПоследняяПоследняя

Похожие темы

  1. HTML шаблон
    от Dmitriko в разделе Дизайн сайтов
    Ответов: 2
    Последнее сообщение: 27.07.2012, 11:35
  2. Шаблон Div в 3 колонки
    от Xylitolq в разделе Вёрстка сайта
    Ответов: 35
    Последнее сообщение: 28.07.2009, 14:27
  3. Шаблон на DIV'ах
    от AlexLSL в разделе Вёрстка сайта
    Ответов: 7
    Последнее сообщение: 19.11.2008, 06:40
  4. Шаблон DIV в 3 колонки
    от Lann в разделе Вёрстка сайта
    Ответов: 18
    Последнее сообщение: 25.11.2007, 22:04
  5. Шаблон из html в php
    от Рёга в разделе Вёрстка сайта
    Ответов: 1
    Последнее сообщение: 16.07.2007, 11:44

Ваши права

  • Вы не можете создавать новые темы
  • Вы не можете отвечать в темах
  • Вы не можете прикреплять вложения
  • Вы не можете редактировать свои сообщения
  •