ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Не могу разобраться с футером
16 сообщений из 16, страница 1 из 1
Не могу разобраться с футером
    #38655768
Sanprof
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Sanprof
Гость
собственно в верстке некоторые моменты не совсем понимаю, есть такой CSS
Код: css
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
* {
    margin: 0px;
    padding: 0px;
}

html, body {
    height: 100%;
    background-color: #DDE4EA;
}

.container {
    max-width: 1250px;
    margin: 0 auto;
}

.page {
    min-height: 100%;
    height: auto !important;
    height: 100%;
}

.wrap {
    padding-bottom: 77px;
}

.footer {
    height: 77px;
    margin-top: -77px;
    background: url('../images/footer.png') repeat-x;
}



с конструкцией ниже футер отрабатывает как надо

Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
<body>
<div class="page">
        <div class="wrap">
            Content
        </div>
    </div>
    <div class="footer">
        Footer
    </div>
</body>



теперь мне понадобилось разместить мой контент и футер в средине окна браузера определенной ширины, тоесть по высоте 100% по ширине ограниченно, заключаю всю конструкцию в div, получаю контент посередине, но футер теперь не отрабатывает, почему и как мне решить эту проблему?

Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
<body>
    <div class="container">
    <div class="page">
        <div class="wrap">
            Content
        </div>
    </div>
    <div class="footer">
        Footer
    </div>
</div>
</body>
...
Рейтинг: 0 / 0
29.05.2014, 13:51
| Ответить | Цитировать | Написать  
Не могу разобраться с футером
    #38655841
Sanjar88
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Sanjar88
Участник
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
<body>
    <div class="wrapper">

        <div class="content">
            Content
        </div><!--конец контента-->
   
  </div><!--конец обёртки-->

   <div class="footer">
        Footer
    </div><!--конец футера-->
</body>


Код: css
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
.wrapper{
width:100%;
}
.contant{
max-width: 1250px;
    margin: 0 auto;
}
.footer{
max-width: 1250px;
margin:0 auto;
background: url('../images/footer.png') repeat-x;
}



футер не отрабатывает потому что идёт после контейнера, т.е. не наследует условия контейнера

если мой вариант не подошел попробуйте футер перед контейнером закинуть
...
Рейтинг: 0 / 0
29.05.2014, 14:35
| Ответить | Цитировать | Написать  
Не могу разобраться с футером
    #38655883
Sanprof
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Sanprof
Гость
Sanjar88футер не отрабатывает потому что идёт после контейнера, т.е. не наследует условия контейнера

если мой вариант не подошел попробуйте футер перед контейнером закинуть
к сожалению не работает ни так ни так.
...
Рейтинг: 0 / 0
29.05.2014, 14:55
| Ответить | Цитировать | Написать  
Не могу разобраться с футером
    #38655889
Sanjar88
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Sanjar88
Участник
а без margin-top? попробуйте что получится
...
Рейтинг: 0 / 0
29.05.2014, 14:57
| Ответить | Цитировать | Написать  
Не могу разобраться с футером
    #38655898
Sanprof
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Sanprof
Гость
Sanjar88а без margin-top? попробуйте что получится
так футер стал на 77px ниже.
...
Рейтинг: 0 / 0
29.05.2014, 15:02
| Ответить | Цитировать | Написать  
Не могу разобраться с футером
    #38655899
Sanjar88
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Sanjar88
Участник
хм, попробовал накидать у себя ваш макет, у меня всё отображается как надо, и футер и контент по середине окна
...
Рейтинг: 0 / 0
29.05.2014, 15:03
| Ответить | Цитировать | Написать  
Не могу разобраться с футером
    #38655905
Sanprof
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Sanprof
Гость
Вот мне что типа такого нужно
...
Рейтинг: 0 / 0
29.05.2014, 15:05
| Ответить | Цитировать | Написать  
Не могу разобраться с футером
    #38655906
Sanjar88
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Sanjar88
Участник
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
      <html> 
    <head>
                
             <link rel="stylesheet" href="css/test.css">
                      
    </head>

 <body>
    <div class="container">
    <div class="page">
        <div class="wrap">
            Content
        </div>
    </div>
    <div class="footer">
        Footer
    </div>
</div>
</body>
</html>



Код: css
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
* {
    margin: 0px;
    padding: 0px;
}

html, body {
    height: 100%;
    background-color: #DDE4EA;
}

.container {
    max-width: 1250px;
    margin: 0 auto;
}

.page {
    min-height: 100%;
    height: auto !important;
    height: 100%;
}

.wrap {
    padding-bottom: 77px;
	background-color:#fff;
}

.footer {
    height: 77px;
    margin-top: -77px;
    background-color:#3a3;
}
...
Рейтинг: 0 / 0
29.05.2014, 15:05
| Ответить | Цитировать | Написать  
Не могу разобраться с футером
    #38655911
Sanjar88
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Sanjar88
Участник
так я не понял, вам надо чтобы содержимый текст был по центру или самы дивы были по центру?
...
Рейтинг: 0 / 0
29.05.2014, 15:06
| Ответить | Цитировать | Написать  
Не могу разобраться с футером
    #38655921
Sanprof
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Sanprof
Гость
Sanjar88так я не понял, вам надо чтобы содержимый текст был по центру или самы дивы были по центру?
содержимое этих дивов имеет свою структуру со своими выравниваниями, щас задача стоит в том как правильно разместить основные контейнеры.
...
Рейтинг: 0 / 0
29.05.2014, 15:11
| Ответить | Цитировать | Написать  
Не могу разобраться с футером
    #38655924
Sanjar88
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Sanjar88
Участник
не знаю тогда, у меня всё нормально отобразилось как вы и хотели
...
Рейтинг: 0 / 0
29.05.2014, 15:13
| Ответить | Цитировать | Написать  
Не могу разобраться с футером
    #38655926
Sanprof
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Sanprof
Гость
в данном случае у меня два основных контейнера это CONTENT и FOOTER, на картинке я их просто обозначил, о содержимом этих контейнеров можете не задумываться.
...
Рейтинг: 0 / 0
29.05.2014, 15:13
| Ответить | Цитировать | Написать  
Не могу разобраться с футером
    #38655931
Sanprof
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Sanprof
Гость



на картинках видно, что не отрабатывает
...
Рейтинг: 0 / 0
29.05.2014, 15:15
| Ответить | Цитировать | Написать  
Не могу разобраться с футером
    #38655975
Sanjar88
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Sanjar88
Участник
может дело в конструкторе он не отображает как надо? вы это всё попробуйте на листе накидать, т.е. уже в готовый сайт сделать
...
Рейтинг: 0 / 0
29.05.2014, 15:35
| Ответить | Цитировать | Написать  
Не могу разобраться с футером
    #38656089
Sanprof
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Sanprof
Гость
Sanjar88может дело в конструкторе он не отображает как надо? вы это всё попробуйте на листе накидать, т.е. уже в готовый сайт сделать
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Прижатый к низу футер</title>
    <style type="text/css">
        * {
            margin: 0px;
            padding: 0px;
        }
        
        html, body {
            height: 100%;
            background-color: #DDE4EA;
        }
        
        .container {
            max-width: 1250px;
            margin: 0 auto;
        }
        
        .page {
            min-height: 100%;
            height: auto !important;
            height: 100%;
        }
        
        .wrap {
            padding-bottom: 77px;
            background-color: #000;
            color: White;
        }
        
        .footer {
            height: 77px;
            margin-top: -77px;
            background-color: #E11;
            color: White;
        }
    </style>
</head>
<body>
    <!--<div class="container">-->
    <div class="page">
        <div class="wrap">
            Content
        </div>
    </div>
    <div class="footer">
        Footer
    </div>
    <!--</div>-->
</body>
</html>



беру этот код и он отображает то, что на верхнем изображении, а если раскомментировать див, то получаю то, что на нижнем изображении.

...
Рейтинг: 0 / 0
29.05.2014, 16:28
| Ответить | Цитировать | Написать  
Не могу разобраться с футером
    #38656232
Sanprof
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Sanprof
Гость
вобщем вопрос решен, нужно было в класс container добавить height: 100%; и все заработало как надо
Код: css
1.
2.
3.
4.
5.
.container {
    max-width: 1250px;
    margin: 0 auto;
    height: 100%;
}
...
Рейтинг: 0 / 0
29.05.2014, 17:52
| Ответить | Цитировать | Написать  
16 сообщений из 16, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Не могу разобраться с футером
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&msg=38655841&tid=1447039]:
 0ms
get settings:
 9ms
get forum list:
 15ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 145ms
get topic data:
 10ms
get forum data:
 3ms
get page messages:
 58ms
get tp. blocked users:
 2ms
others: 251ms
total:  499ms
созд. / загр.: 499ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]