<MyRusakov.ru />

Вёрстка сайта с нуля 2.0

Вёрстка сайта с нуля 2.0

Система "Вёрстка сайта с нуля 2.0" содержит в себе не только сами видеоуроки по адаптивной вёрстке сайтов с примерами, но и вспомогательную систему для более эффективного обучения.

Сам курс обучит Вас абсолютно с нуля HTML5 и CSS3, а также научит верстать сайты с помощью реальных примеров вёрстки. Обучение идёт от простого к сложному. В последнем разделе курса идёт обучение адаптивной вёрстке сайтов: Вы узнаете всю необходимую теорию, а также увидите пример реальной адаптивной вёрстки сайта.

Как итог, курс совмещает в себе всё, что нужно по HTML, CSS и адаптивной вёрстке сайтов, с наглядными примерами, с обучением от простого к сложному и без необходимости иметь начальных знаний, а благодаря вспомогательной системе психологически курс проходится очень легко, а на выходе Вы сможете сделать адаптивную вёрстку любого сайта любой сложности.

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

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

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

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

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

Каким движком Вы предпочитаете пользоваться?

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

Не работает div верстка.
19.01.2013 21:30:13 Не работает div верстка. Сообщение #1
Паркан

Паркан

Новичок

Новичок

Дата регистрации:
30.10.2012 19:40:33

Сообщений: 15

Есть html:
<div class='widget'>
<div class='widget-header'>
<h3>
Панель управления
</h3>
<div class='widget-actions'></div>
</div>
<div class='widget-content'>
<p>Выберите необходимое действие</p>
<div class='stat'>
<a href='../cp/new.php'><div class='element'><div class='element_img'><img src='../img/add.png' /></div>Новый заказ</div></a>
<a href='../cp/orders.php'><div class='element'><div class='element_img'><img src='../img/shoppingcart.png' /></div>Заказы</div></a>
<a href='../cp/bliing.php'><div class='element'><div class='element_img'><img src='../img/kwallet.png' /></div>Биллинг</div></a>
<a href='../cp/account.php'><div class='element'><div class='element_img'><img src='../img/loginmanager.png' /></div>Аккаунт</div></a>
<a href='../cp/support.php'><div class='element'><div class='element_img'><img src='../img/helpandsupport.png' /></div>Поддержка</div></a>
</div>

</div>
</div>
</div>

И его свойства:
.widget {
clear: both;
margin-bottom: 10px;
position: relative;
width: auto;
}
.widget-header {
background: -o-linear-gradient(top, #FAFAFA 0px, #E9E9E9 100%) transparent;
border: 1px solid #00ccff;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
box-shadow: inset 0px 1px 0px #FFFFFF;
height: 40px;
line-height: 40px;
position: relative;
}
.widget-content {
background: #FFFFFF;
border-bottom: 1px solid #00ccff;
border-left: 1px solid #00ccff;
border-radius: 5px 5px 5px 5px;
border-right: 1px solid #00ccff;
border-top: 1px solid #00ccff;
padding: 10px 10px 10px;
}
.widget-header .widget-actions {
display: inline-block;
float: right;
height: 40px;
line-height: 40px;
margin-right: 0.85em;
vertical-align: middle;
}
.stat {
margin-top: 1.25em;
}
.element{
clear: both;
height:150px;
width: 128px;
}
.element_img{
clear: both;
width: 128px;
}

Проблема в том, что я не могу element_img выровнять по правому краю. Перестает работать widget-content и блок element оказывается за его пределами. Помогите пжл.
Профиль Ответить
20.01.2013 10:07:00 Не работает div верстка. Сообщение #2
Скромняга

Скромняга

Освоившийся

Освоившийся

Дата регистрации:
04.03.2012 01:24:28

Сообщений: 37

Я бы вам не рекомендовал использовать так много блоков на такой простой странице.

Лучше сразу пересмотрите подход, не обязательно совать везде div'ы
Профиль Ответить
20.01.2013 12:24:29 Не работает div верстка. Сообщение #3
Паркан

Паркан

Новичок

Новичок

Дата регистрации:
30.10.2012 19:40:33

Сообщений: 15

Я сделал все в виде таблицы, вроде теперь работает как надо.
Профиль Ответить
20.01.2013 20:48:34 Не работает div верстка. Сообщение #4
Скромняга

Скромняга

Освоившийся

Освоившийся

Дата регистрации:
04.03.2012 01:24:28

Сообщений: 37

Извините, возможно я вас запутаю совсем)

Табличная вёрстка давно ушла в небытие.

Я говорил лишь о том, что не нужно так много пихать блоков, есть же и проще и легче варианты.
Профиль Ответить
26.01.2013 18:30:58 Не работает div верстка. Сообщение #5
malina95

malina95

Мастер

Мастер

Дата регистрации:
15.07.2012 07:13:44

Сообщений: 208

Михаил, а вы можете записать бесплатный курс по адаптивной блочной вёрстке?
Было бы полезно...
Профиль Ответить