Новости
Видео
Microsoft
Windows 10
Железо
Программы
Форум

Имя пользователя:
Пароль:  
Помощь | Регистрация | Забыли пароль?  | Правила  

Компьютерный форум OSzone.net » Компьютеры + Интернет » Вебмастеру » Помогите с версткой!

Ответить
Настройки темы
Помогите с версткой!

Старожил


Сообщения: 164
Благодарности: 0

Профиль | Отправить PM | Цитировать

Изменения
Автор: Bullet-Avalon
Дата: 23-06-2009
Помогите с версткой, вот код, дело в том что при вставке оч большого сообщения в облости контента, контент съежает под футер, подробнее на скрине, как этого избежать, где ошибка, плиз помогите!
HTML код: Выделить весь код
<!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">  
<meta name="description" content=" "> 
<meta name="keywords" content=" "> 
<link href="style.css" rel="stylesheet" type="text/css"> 
<title>  </title> 
</head> 
<body  > 
<!-- Header -->  
<div id="page">
<div id="head">
<div id="head_1"></div><div id="head_bg"></div><div id="head_2"></div>
</div>  
<!--Content-->  
<div id="table"></div> 
</div>  
<!-- Footer -->  
<div id="footer">
<div id="footer_1"></div><div id="footer_bg"></div><div id="footer_2"></div>
</div>          
</body> </html>



<!--CSS файл -->
html, body {
margin: 0; padding: 0; 
width: 100%; height: 100%; 
background-image:url('img/bg.gif');}

#page{
position:relative; min-height:100%;
 height:auto; height:100%;}

#head{
position:relative; width:900px; height:100px;
left:50%; top:0px; margin-left:-450px;
padding-top:0px; margin-top:0px; }

#head_1{
position:absolute; width:10px;
height:100px; margin-left:0px; float:left; 
background-image:url('img/l_head.gif');}

#head_bg{
position:absolute; width:880px; 
height:100px; margin-left:10px; float:left; 
background-image:url('img/bg_head.gif');}

#head_2{
position:absolute; width:9px; height:100px;
 margin-left:890px; float:left; 
background-image:url('img/r_head.gif'); }

#table{
position:absolute; width:870px; border: 
1px solid #000000; padding-bottom:50px;
 margin-left:-435px; left:50%;}

#footer{
position:absolute;  width:900px; height:50px;
 bottom:0px; margin-left:-452px; left:50%;
 margin-top:-50px;}

#footer_1{
position:absolute; width:12px; height:50px;
 margin-left:0px; float:left; 
background-image:url('img/l_footer.gif');}

#footer_bg{
position:absolute; width:874px; height:50px; 
margin-left:12px; float:left; 
background-image:url('img/bg_footer.gif');}

#footer_2{position:absolute; width:14px; 
height:50px; margin-left:886px; float:left;
 background-image:url('img/r_footer.gif'); }

Отправлено: 17:13, 01-02-2009

 

Аватара для Coutty

Кот Ти


Сообщения: 7318
Благодарности: 1204

Профиль | Отправить PM | Цитировать

Используйте для футера relative-позиционирование.
Цитата:
#footer{
position:relative; width:900px; height:50px;
top:0px; margin-left:-452px; left:50%;
margin-top:-50px;}

Отправлено: 19:05, 01-02-2009 | #2



Для отключения данного рекламного блока вам необходимо зарегистрироваться или войти с учетной записью социальной сети.

Если же вы забыли свой пароль на форуме, то воспользуйтесь данной ссылкой для восстановления пароля.


Старожил


Сообщения: 164
Благодарности: 0

Профиль | Отправить PM | Цитировать

Цитата Coutty:
Используйте для футера relative-позиционирование.
Цитата:
#footer{
position:relative; width:900px; height:50px;
top:0px; margin-left:-452px; left:50%;
margin-top:-50px;} »
К сожаленью тоже самое выходит, футер остается на месте а контент уезжает вниз...

Отправлено: 19:30, 01-02-2009 | #3


Аватара для System Failure

Старожил


Сообщения: 175
Благодарности: 15

Профиль | Отправить PM | Цитировать

а если для распределения контента по странице пользоваться таблицей? в таком случае разъежаться точно ничего не будет. для более мелких элементов можно, конечно, и CSS использовать...

конечно это не совсем решение проблемы - а, так сказать, уход от неё...

Отправлено: 03:16, 02-02-2009 | #4


Ветеран


Сообщения: 1862
Благодарности: 132

Профиль | Сайт | Отправить PM | Цитировать

Сколько я ни бился, у меня получилось более-менее так. bottom:10px;
Футер находится внизу и вниз убегает при перерисовке страницы, но вот если контента маловато, футер поднимается наверх, чуть ли не до середины страницы.

-------
ДИЛЕТАНТ - это курьезный человек, который испытывает удовольствие делать то, чего не умеет.
AMD 4200+, MSI Neo2Platinum, 2Gb, ATI 9600, D-Link DWL-G510, FreeBSD 8.0, KDE 4.3.4

Отправлено: 22:12, 02-02-2009 | #5



Компьютерный форум OSzone.net » Компьютеры + Интернет » Вебмастеру » Помогите с версткой!

Участник сейчас на форуме Участник сейчас на форуме Участник вне форума Участник вне форума Автор темы Автор темы Шапка темы Сообщение прикреплено

Похожие темы
Название темы Автор Информация о форуме Ответов Последнее сообщение
[решено] Помогите с версткой Bullet-Avalon Вебмастеру 8 28-09-2009 20:43
ПОмогите с версткой, плз... Bullet-Avalon Вебмастеру 1 02-05-2009 13:22
Помогите с версткой Bullet-Avalon Вебмастеру 3 27-11-2008 20:43


« Предыдущая тема | Следующая тема »


 
Переход