<MyRusakov.ru />

WordPress 6 с Нуля до Гуру

WordPress 6 с Нуля до Гуру

Этот курс научит Вас созданию самых разных сайтов на самой популярной в мире CMS - WordPress. Вы увидите установку и настройку локального сервера, разбор каждой настройки, каждой кнопки и каждого пункта меню в панели WordPress.

Также Вы получите и всю практику, поскольку прямо в курсе с нуля создаётся полноценный Интернет-магазин, который затем публикуется в Интернете. И всё это прямо на Ваших глазах.

Помимо уроков к курсу идут упражнения для закрепления материала.

И, наконец, к курсу идёт ценнейший Бонус по тому, как используя ChatGPT и создавая контент для сайта, можно выйти на пассивный доход. Вы наглядно увидите, как зарегистрироваться в ChatGPT (в том числе, и если Вы из России), как правильно выбрать тему для сайта, как правильно генерировать статьи для него(чтобы они индексировались поисковыми системами) и как правильно монетизировать трафик на сайте.

Подробнее
Уроки и статьи
Подписка

Подпишитесь на мой канал на YouTube, где я регулярно публикую новые видео.

YouTube Подписаться

Подписавшись по E-mail, Вы будете получать уведомления о новых статьях.

Подписка Подписаться

Добавляйтесь ко мне в друзья ВКонтакте! Отзывы о сайте и обо мне оставляйте в моей группе.

Мой аккаунт Мой аккаунт Моя группа
Опрос

Какая тема Вас интересует больше?

Форум сайта MyRusakov.ru

Блоки выезжают под футер
15.10.2011 21:33:08 Блоки выезжают под футер Сообщение #1
brussens

brussens

Мега-мастер

Мега-мастер

Дата регистрации:
11.10.2011 22:50:07

Сообщений: 438

Сегодня решил сверстать главную страницу для нового проекта, только вот появилась проблема, при добавлении большого количества блоков в левой колонке, основной блок не тянется, и блоки просто выезжают вниз под футер, кто может помоч?
Профиль
15.10.2011 21:38:13 Блоки выезжают под футер Сообщение #2
Admin

Admin

Администратор

Администратор

Дата регистрации:
27.05.2010 21:23:42

Сообщений: 3063

Покажите текущий HTML-код.
Профиль
15.10.2011 21:41:30 Блоки выезжают под футер Сообщение #3
brussens

brussens

Мега-мастер

Мега-мастер

Дата регистрации:
11.10.2011 22:50:07

Сообщений: 438

html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>ALGEBRA - Главная</title>
<link href="styles/index.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="header"></div>
<div id="main">
<div id="headnav">
<div id="userpanel">
<div id="pr"><strong>Рейтинг: <a href="#">107,5</a></strong>
</div>
</div>
<div id="menubg">
<div id="menulogo"></div>
<ul id="menu">
<li><a href="#">Главная</a></li>
<li><a href="#">Афиша</a></li>
<li><a href="#">Миксы</a></li>
<li><a href="#">Треки</a></li>
<li><a href="#">Ремиксы</a></li>
<li><a href="#">Поиск</a></li>
<li><a href="#">DJ's</a></li>
<li><a href="#">TOP</a></li>
<li><a href="#">Фото</a></li>
<li><a href="#">Видео</a></li>
<li><a href="#">Новости</a></li>
<li><a href="#">Маркет</a></li>
</ul>
</div>
<div>
<div id="leftside">
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
</div>
<div id="contentside"></div>
<div id="rightside">
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="footer"><p>ALGEBRA &copy; 2011. Все права защищены!</p></div>

</body>
</html>

css
@charset "utf-8";
/* CSS Document */
body {
background-color:#000;
background-image:url("../images/header.png";
background-repeat:no-repeat;
}
#main {
background-color:#FFF;
width:990px;
min-height:1000px;
border-radius:7px 7px 0 0;
border-bottom-image: url("../images/border.png"/round;
}
#userpanel {
height:30px;
padding-top:15px;
}
#headnav {
padding-right:10px;
padding-left:10px;
}
#header {
min-height:350px;
}
#footer {
background-color:#999;
width:990px;
min-height:50px;
text-align:center;
padding-top:10px;
font-size:14px;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
background-position:bottom;
position:absolute;
}
#leftside {
width:239px;
min-height:500px;
float:left;
}
#contentside {
width:470px;
min-height:500px;
float:left;
border:1px solid #000;
border-radius:7px;
margin:10px;
}
#rightside {
width:239px;
min-height:500px;
float:left;
}
#menubg {
background-color:#000;
height:30px;
padding-top:10px;
border-radius:7px;
}
#menu {
list-style:none;
display:inline;
color:#FFF;
padding-left:10px;
padding-right:10px;
}
#menu li{
list-style:none;
display:inline;
padding:3px;
color:#FFF;
font-size:12px;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
}
#menu li a {
text-decoration:none;
color:#FFF;
}
#menu li a:hover {
text-decoration:none;
border-bottom: none;
color:#FFF;
border-bottom: 1px dashed #FFF;
}
#menu li a:active {
color:#FFF;
}
#menu li a:visited {
text-decoration:blink;
color:#FFF;
}
.block {
background-color:#FFF;
}
.blockbody {
background-color:#FFF;
padding:5px;
border:1px solid #000;
border-radius:7px;
margin-top:10px;
}
.blockbody h1 {
font-size:14px;
margin:5px;
}
#pr {
text-align:right;
font-size:12px;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
}
#pr a {
background-color:#C30;
text-decoration:none;
color:#FFF;
padding:1px;
}
Профиль
15.10.2011 21:47:04 Блоки выезжают под футер Сообщение #4
Admin

Admin

Администратор

Администратор

Дата регистрации:
27.05.2010 21:23:42

Сообщений: 3063

Добавьте перед блоком с footer, такой блок:
<div style="clear: both;"></div>
Профиль
15.10.2011 21:49:52 Блоки выезжают под футер Сообщение #5
brussens

brussens

Мега-мастер

Мега-мастер

Дата регистрации:
11.10.2011 22:50:07

Сообщений: 438

Спасибо, добавил, но только футер встал на место, что косается основного блока, то он не тянется всё равно(((
Профиль
15.10.2011 22:10:45 Блоки выезжают под футер Сообщение #6
Admin

Admin

Администратор

Администратор

Дата регистрации:
27.05.2010 21:23:42

Сообщений: 3063

У Вас вёрстка в основе неправильная. Тут исправить крайне проблемно, а дальше будет только хуже.
Основа блочной вёрстки для Вашего формата примерно такая:
Блок_головы
Блок_верхнего_меню
Блок_центральной_части
Левый_блок
Правый_блок
Центральный_блок
Блок_отмены_позиционирования
Блок_подвала
Поэтому переделайте вёрстку по этому шаблону.
"Блок отмены позиционирования" - это тот блок, что я дал в предыдущем сообщении.
Профиль
16.10.2011 20:31:53 Блоки выезжают под футер Сообщение #7
brussens

brussens

Мега-мастер

Мега-мастер

Дата регистрации:
11.10.2011 22:50:07

Сообщений: 438

Спасибо, Михаил. Начал заново делать по тому варианту, что вы мне сказали, только вот всё равно не тянется тот блок, в котором находятся сами блоки. т.е. левый, правый, и центральный, вот код:
html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Главная</title>
<link href="styles/index.css" rel="stylesheet" type="text/css">
</head>

<body>
<div id="header"></div>
<div id="main">
<div id="userpanel">
<div id="pr"><strong>Рейтинг: <a href="#">107,5</a></strong>
</div>
</div>
<div id="leftside">
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
<div class="blockbody"><h1>Кто онлайн?</h1>
<div class="block" title="Кто онлайн?">0 пользователей онлайн.</div>
</div>
</div>
<div id="rightside"></div>
<div id="contentside"></div>

</div>
<div style="clear: both;"></div>
<div id="footer"></div>
</body>
</html>

css
@charset "utf-8";
/* CSS Document */
body {
background-color:#000;
}
#main {
background-color:#FFF;
width:990px;
min-height:600px;
margin-left:auto;
margin-right:auto;
}
#leftside {
background-color:#0F9;
width:245px;
min-height:600px;
float:left;
}
#rightside {
background-color:#0CF;
width:245px;
min-height:600px;
float:right;
}
#contentside {
background-color:#9F9;
width:500px;
min-height:600px;
float:left;
}
#footer {
background-color:#CCC;
background-position:bottom;
width:990px;
min-height:100px;
margin-left:auto;
margin-right:auto;
}
.block {
background-color:#FFF;
}
.blockbody {
background-color:#FFF;
padding:5px;
border:1px solid #000;
border-radius:7px;
margin-top:10px;
}
.blockbody h1 {
font-size:14px;
margin:5px;
}

Профиль
16.10.2011 20:36:16 Блоки выезжают под футер Сообщение #8
brussens

brussens

Мега-мастер

Мега-мастер

Дата регистрации:
11.10.2011 22:50:07

Сообщений: 438

Михаил, простите за ложную тревогу, решил проблему добавив после <div id="contentside"></div>
блок отмены позиционирования, если не сложно, прокомментируйте пожалуйста переделанный код, заранее благодарен)
Профиль
16.10.2011 20:39:06 Блоки выезжают под футер Сообщение #9
Admin

Admin

Администратор

Администратор

Дата регистрации:
27.05.2010 21:23:42

Сообщений: 3063

Комментировать здесь особо нечего, структура является обычной блочной вёрсткой. И каждый верстальщик её использует в основе сайта.
Что касается блока отмены позиционирования, то он предназначен для того, чтобы отменить влияние свойства float, иначе блоки начнут залезать друг на друга. А если отменить (то есть блок с clear: both, то тогда последующие блоки будут находиться не сбоку предыдущих, а снизу, что и требуется для блока с footer.
Профиль