В коде от Aykroyd присутствует
margin: 0px auto;
overflow:hidden;
опишите, зачем они используются
В коде от Aykroyd присутствует
margin: 0px auto;
overflow:hidden;
опишите, зачем они используются
margin: 0px auto; используется для горизонтального центрирования блочного элемента внутри родительского элемента (контейнера)...
Свойство overflow со значением hidden предназначено для устранения проваливания элементов с float через низ содержащего их контейнера в нормальных браузерах...
Подскажите.
Если у меня стоит
#div1 {
width:100%;
margin-right:-200px;
}
Как сделать, чтобы вложенный див был внутри этих размеров? если 100% ставлю, то он закрывает правую ячейку..
Задача: сделать внутри div1 две ячейки по 50% от его размера, а не от общего)
<div id="div1">
<div>50%</div> <div>50%</div>
</div>
Я не знаю что Вы понимаете под "общим" размером, но по Вашим словам получается "масло маслянное"... Размеры дочерних элементов и так (по умолчанию) всегда считаются от размеров своих родительских элементов...
И еще... Забудьте Вы про ячейки... Нет в блочной модели никаких ячеек...закрывает правую ячейку..
а скрипт где
script src="js/minmax.js" type="text/JavaScript
И все-таки, раз есть тема давайте выведем основные шаблоны 3-колоночных сайтов с масштабируемым центральным блоком.
Честно признаюсь, для меня большая проблема - проваливания из-за превышающего размеры центрального поля в неправильных броузерах.
[/quote]
Один такой "основной" шаблон как раз и выведен в этой теме. Немного выше. Причем смею Вас заверить, что там ничего никуда не проваливается... Ни при каких обстоятельствах, ни в правильных браузерах, ни в неправильных...
Как сделать что бы левая и правая колонка была одинакового размера по длине? До самого футера.
У меня правая колонка длиннее левой и в результате левая не дотягивается до футера..
Верстал по шаблону Aykroyd
Вон оно в чем дело... ) Ну так, это уже совсем другая история... Вышеописанный шаблон демонстрирует решение несколько иных задач – в частности, вынос основного контента в коде на самый верх (меняем колонки местами) и поддержку max-width.
Никак. Потому что в CSS нет средств сказать «высота как вот у того другого элемента».Как сделать что бы левая и правая колонка была одинакового размера по длине?
Но выход есть. Причем весьма известный. И писал я о нем довольно много, правда, в других темах...
Воспользуйтесь техникой Faux Columns... Не задавайте фоновый цвет или изображения для самих колонок... Для левой колонки задайте фоновое изображение в элементе html, а для правой – в элементе body...
И будет Вам счастье...
P.S. Правда, от max-width в данном конкретном случае скорее всего придется отказаться...
Прошу извинить меня, но честно говоря не понял...
Код:<!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>
Спасибо, за пример, но у меня немножко посложнее ситуация..
у меня в левую колонку(div) вписана таблица, в таблице только левому столбцу надо сделать bgcolor, Т.е. у левой колонки нет бэка..
[/quote]
А Вы уверены, что ей там самое место? )
[/quote]
Ну так и сделайте ему фоновый цвет. В чем проблема? Только не атрибутом bgcolor, а при помощи стилевых спецификаций. Если же необходимо, чтобы этот столбец тянулся до самого футера – НЕ делайте ему фоновый цвет. Подложите вместо этого фонового цвета соответствующее фоновое изображение (с необходимым цветом) в элемент html. Хрен редьки не слаще...
[/quote]
По Вашему бэк – это обязательно во всю ширину колонки?
Я верстал сайт по этому шаблону
<div id="container"><!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-content">
*
</div>
</div>
</body>
</html>[/quote]
У Вас же теперь совершенно другая структура... придеться передалыватЬ?
Подскажите как бек не на всю ширину сделать?
[/quote]
А где Вы его взяли?
В этой теме таких шаблонов (с такой структурой и такими идентификаторами) даже близко не встречалось.
[/quote]
Вы издеваетесь? )
У Вас проблема сделать в Фотошопе картинку меньшей ширины?
Сдурил так сдурил.. гляжу тема обновилась, думал файл приатаченый автором - теперь эталонный шаблон, его и взял за основу.. Опять верстать :fie: :fie: :fie:
Я так понимаю в левой и правой колонке - вообще нельзя будет вставлять рисунки?
Или к примеру, у меня в DIV(правая колонка) вписана таблица, в одной из ячеек таблицы вставлена картинка.
Это так и останется:
<table style='MARGIN-LEFT: 0px; WIDTH: 100%' cellspacing='0'* * * * cellpadding='0' border='0'><tbody>* * * * <tr>* * * * * <td><img src='images/3r3.jpg' alt='' width='200' height='48' /></td>
Я пытаюсь самый первый приведенный тут Айвкодом шаблон применить, и приходится при широком контентном поле деать большой min-width.
spbhouse.ru/photogallery.html на ослах совсем плохо работает.