| |
|
|
| | Уважаемые помогите с позиционированием CSS!
У меня две таблицы вложены в одну, мне нужно эти две таблицы разместить одну сверху, а другую снизу и чтобы они не зависили друг от друга, т.е. одну ровнять поверху а другую понизу? | |
| |
|
|
| |
|
|
| |
для: xpom
(11.01.2007 в 11:53)
| | | чем не подходит вариант:
<table>
<tr>
<td><table>...</table></td>
</tr>
<tr>
<td><table>...</table></td>
</tr>
|
В этом случае CSS не нужен вовсе... хотя... Короче: уточни задачу. | |
| |
|
|
| |
|
|
| |
для: xpom
(11.01.2007 в 11:53)
| | | А сделать две строки по одной ячейке, и для верхней поставить align="top", a для нижней align="bottom" не получается ? | |
| |
|
|
| |
|
|
| |
для: Fear.86
(11.01.2007 в 12:10)
| | | Не совсем таблицы слои скорее!
Вот например:
#bottom { /* Это слой всей страницы*/
position: static ; width: 100%; height: 100%;
background-image:url(foni/fon2.gif);
background-position : center;
}
#col2 { /* Это тот что нужно разместить сверху*/
position: relative; /* Но сверху этого имеются еще три слоя*/
top: 40px; /* Нужно размещать относительно верхних трех*/ left: 2%;
margin-bottom: 100px;
width: 77%; height: 35%; background-image:url(foni/fon5.gif);
float: left;
}
#niz { /*Это тот что разместить сверху*/
position: relative; /*Этот размещать относительно низа */
right: 5%; /*слоя #bottom */
bottom: 10px;
height: 70px;
width: 90%; background-image:url(foni/fon5.gif);
float: right;
}
|
нужно чтобы слой #col2 не зависил от слоя #niz? | |
| |
|
|
| |
|
|
| |
для: xpom
(11.01.2007 в 12:35)
| | | посмотри вот это.а вообщето не относительное, а абсолютное позиционирование попробуй. | |
| |
|
|
| |
|
|
| |
для: AlexSol
(11.01.2007 в 12:55)
| | | Проблема в том, как сделать нижний колонтитул страницы, т.е. низ страницы, только чтобы он был не зафиксирован? | |
| |
|
|
| |
|
|
| |
для: xpom
(11.01.2007 в 13:50)
| | | для body высоту 100%
а контитул в див с position:absolute;bottom:0; | |
| |
|
|
| |
|
|
| |
для: AlexSol
(11.01.2007 в 13:53)
| | | Почемуто не получается?
контитул внизу пока не появляется прокрутка, а потом получается на месте стоит по середине?
А как сделать, если в таблицу вложу див, а когда див увеличивается по высоте чтобы он вмещался в таблицу, а не выходил за границы таблицы? | |
| |
|
|
| |
|
|
| |
для: xpom
(11.01.2007 в 15:15)
| | | смотрел тока эксплорером, может еще вечером гляну... (бордюры убери, они для наглядности, поскольку есть пересекание)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Untitled Document</title>
<style>
body,html{
height:100%;
padding:0 5px;
margin:0
}
#all{
height:100%;
position:relative;
top:0;
left:0;
}
#main{
border:1px solid silver;
padding-bottom:80px;
}
#footer{
position:absolute;
bottom:0;
border:1px solid red;
width:100%;
height:60px;
}
</style>
</head>
<body>
<div id="all">
<div id="main">
121212<br>
121212<br>
121212<br>121212<br>
121212<br>
121212<br>121212<br>
121212<br>
121212<br>121212<br>
121212<br>
121212<br>121212<br>
121212<br>
121212<br>121212<br>
121212<br>
121212<br>121212<br>
121212<br>
121212<br>121212<br>
121212<br>
121212<br>121212<br>
121212<br>
121212<br>121212<br>
121212<br>
</div>
<div id="footer">
333<br>333<br>333<br>333<br>
</div>
</div>
</body>
</html>
|
| |
| |
|
|
| |
|
|
| |
для: AlexSol
(11.01.2007 в 15:38)
| | | Спасибо, очень помогло!
Но, теперь возникла другая проблема:
Дело в том, что сверху имеется еще 3 дива, в три ряда, где третий ряд из 3-х див,а этот див (main) нужно четвертым рядом как начинаю позиционировать див (main) все сразу портится :(
Подскажите как див (main) сделать четвертым рядом? | |
| |
|
|
| |
|
|
| |
для: xpom
(11.01.2007 в 21:15)
| | | вы знаете, на такие вопросы все чаще хочется ответить в таком духе: "Див сделать четвертым рядом в пятой колонке можно при помощи html и css"
поздно уже... три раза перечитывать желания нет.... может нарисуете то, что хотите получить? | |
| |
|
|
| |
|
|
| |
для: AlexSol
(11.01.2007 в 21:21)
| | | Согласен с AlexSol, нарисуйте (макет) в каком-нить графическом редакторе окончательный вариант того, что вы хотите увидеть на своей странице, а то чем дальше в лес тем "толще партизаны.."))) | |
| |
|
|
| |
|
|
| |
для: xpom
(11.01.2007 в 15:15)
| | | Я предупреждал, что CSS большой "головняк".)
Для того чтобы разместить один слой под другим, не обязательно их вкладывать в общий слой. Общий слой нужен для того чтобы относительно него применять позиционирование (можно даже абсолютное). Я так понимаю тебе нужен верхний слой - заголовок, и нижний слой для какой-то служебной информации... а где контент? где меню навигации? для них тоже нужен свой слой. Сейчас попробую сделать и выложу в следующем сообщении. | |
| |
|
|
| |
|
|
| |
для: xpom
(11.01.2007 в 11:53)
| | | Ещё раз перечитал твой вопрос.. тебе нужны две таблицы или что? Ты говоришь одну ровнять поверху, а вторую понизу, а между ними что? | |
| |
|
|
| |
|
|
| |
для: Valick
(11.01.2007 в 20:25)
| | | Хроm: видятся 2 ошибки, которых нет у AlexSol: 1) использовать bottom с relative (они для absolute), 2) использовать float c relative (они для inline). | |
| |
|
|
| |
|
|
| |
для: Valick
(11.01.2007 в 20:25)
| | | Я прикрепил рисунок, общего вида слоев!
Тот что по центру прямоугольный ножно чтобы растягивался до низа! | |
| |
|
|
| |
|
|
| |
для: xpom
(11.01.2007 в 21:47)
| | | так бы и нарисовал... а в стороны что-то должно растягиваться?
---------------------
сделаю завтра. | |
| |
|
|
| |
|
|
| |
для: AlexSol
(11.01.2007 в 21:54)
| | | Нет в стороны не должно растягиватся, в стороны в зависимости от разрешения должно занимать всю страницу!
Зазоры между прямоугольниками конечно поменьше, это я на скорую руку рисовал схематически :)! | |
| |
|
|
| |
|
|
| |
для: xpom
(11.01.2007 в 22:35)
| | | >Нет в стороны не должно растягиватся, в стороны в зависимости от разрешения должно занимать всю страницу!
противоречее. тоесть ниодин из блоков не имеет фиксированной ширины? | |
| |
|
|
| |
|
|
| |
для: xpom
(11.01.2007 в 22:35)
| | | Эти три одинаковых прямоугольничка, это типа баннеры? Сделал, но кроме ослика нигде правильно не отображается... начал переделывать, сам загнался))) | |
| |
|
|
| |
|
|
| |
для: xpom
(11.01.2007 в 22:35)
| | | >Нет в стороны не должно растягиватся, в стороны в зависимости от разрешения должно занимать всю страницу!
Советую блок навигации (крайний левый, да и крайний правый) сделать всётаки фиксированными. | |
| |
|
|
| |
|
|
| |
для: Valick
(12.01.2007 в 00:10)
| | | если задать какому-нибудь элементу высоту в процентах, то опера и мозила начинают вести себя странно... вобщем выход один - делать контент заведомо больше высоты экрана. | |
| |
|
|
| |
|
|
| |
для: AlexSol
(12.01.2007 в 11:17)
| | | Блин стока текста написали...
Вот почитал и вашу дискусию, и мне стало интересно всели так плохо ?
Вот, что у меня получилось: | |
| |
|
|
| |
|
|
| |
для: Fear.86
(12.01.2007 в 14:32)
| | | сам как думаешь?
если контента больше чем высота страницы, то в ie футер залазит на текст,
а в опере еще хуже - футер в низ не идет совсем. | |
| |
|
|
| |
|
|
| |
для: AlexSol
(12.01.2007 в 14:48)
| | | >Советую блок навигации (крайний левый, да и крайний правый) сделать всётаки фиксированными.
Да лучще наверное фиксированными! | |
| |
|
|
| |
|
|
| |
для: Fear.86
(12.01.2007 в 14:32)
| | | В том то вся и фишка, что дизайн должен быть полностью "резиновым".
Лично я сдаюсь, два дня "убил" на изобретение "кремлёвской таблетки" - нифика!!! Я склоняюсь к мнению, что как и раньше надо писать отдельный файл стиля для каждого браузера, а уже с помощью Ява Скрипт (ну или РНР) проверять браузер пользователя, и подключать соответсвующий файл стиля.
П.С. Аещё писали что новые версии браузеров "выличили" от этого... лабуда!))) | |
| |
|
|
| |
|
|
| |
для: Valick
(12.01.2007 в 16:34)
| | | to Valick :
да, вылечили - опера и лиса одинаково хреново себя ведут....
я для них впринципе не могу победить наезжание второго блока, если у первого высота в процентах... | |
| |
|
|
| |
|
|
| |
для: AlexSol
(12.01.2007 в 16:38)
| | | >to Valick :
>да, вылечили - опера и лиса одинаково хреново себя ведут....
>
>я для них впринципе не могу победить наезжание второго блока, если у первого высота в процентах...
)))))) А пусть хреново, но хотябы близко друг к другу, а NN вообще чёрти-что выказывает...)))) | |
| |
|
|
| |
|
|
| |
для: Valick
(12.01.2007 в 16:34)
| | | А вот что у меня получилось для "Ослика"...
Могут быть неточности, потому как устал от эксперементов)))) | |
| |
|
|
| |
|
|
| |
для: Valick
(12.01.2007 в 16:39)
| | | для эксплорера несложно =)
а NN вроде уже не пользуют... | |
| |
|
|
| |
|
|
| |
для: AlexSol
(12.01.2007 в 16:50)
| | | Ну так ради чистоты эксперимерта)) | |
| |
|
|
| |
|
|
| |
для: Valick
(12.01.2007 в 16:51)
| | | А можно это с помощью таблиц сделать? | |
| |
|
|
| |
|
|
| |
для: xpom
(12.01.2007 в 22:01)
| | | >А можно это с помощью таблиц сделать?
для сравнения: таблицы - это "пистолет макарова", а слои - это "автомат калашникова" Параметры слоя можно менять с помощью Ява Скрипт динамически, а параметры таблиц не изменишь без перезагрузки страницы.
Можно и с помощью таблиц, попробуешь сам написать? | |
| |
|
|
| |
|
|
| |
для: Valick
(12.01.2007 в 23:26)
| | | да, на таблицах это реализуемо. | |
| |
|
|
| |
|
|
| |
для: Valick
(12.01.2007 в 23:26)
| | | Нет, если слои лучше, тогда лучше я еще помучаюсь со слоями!
А потом как получится! | |
| |
|
|
| |
|
|
| |
для: xpom
(13.01.2007 в 01:34)
| | | Интересно бы узнать, как все сайты делают нижний слой, где отображается Copyright? | |
| |
|
|
| |
|
|
| |
для: xpom
(13.01.2007 в 14:07)
| | | вобщем это надуманная проблема - я еще позавчера написал, что у сайта контент всегда превышает высоту экрана. тоесть ситуаций, когда контента мало и футер выходит не внизу страницы почти нет. | |
| |
|
|
| |
|
|
| |
для: AlexSol
(13.01.2007 в 14:56)
| | | Кто знает как можно сделать, чтобы центральный слой расположенный между двумя крайними принимал ширину взависимости от крайних, т.е. чтобы они могли его сужать и растягивать, при увеличении и уменьшении страницы, сохраняя при этом зазор между слоями? | |
| |
|
|
| |
|
|
| |
для: xpom
(14.01.2007 в 20:20)
| | | Отвлекись немного))) Посмотри вот это... http://www.csszengarden.com/?cssfile=/198/198.css&page=0 | |
| |
|
|
| |
|
|
| |
для: Valick
(14.01.2007 в 20:34)
| | | Да, красиво сделано!
Это я так понял можно сделать с помощью CSS? | |
| |
|
|
| |
|
|
| |
для: xpom
(14.01.2007 в 21:47)
| | | угу. пощелкай меню - может что нужное найдешь. там смысл в написание css-скинов - меняем сайт нетрогая html. а под вопросы лучше новую тему заведи. | |
| |
|
|
