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

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

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

Основы PHP 7

Пройдя курс, Вы узнаете:

- Как установить и настроить OpenServer

- Всю необходимую базу по PHP 7

- Как писать самые различные скрипты на PHP

Общая продолжительность курса 6 часов и 28 минут, плюс упражнения!

Чтобы получить Видеокурс,
заполните форму

Другие курсы

Создание лендингов на заказ

Придя на семинар:

- Вы узнаете мою историю, как я начинал создавать сайты на заказ.

- Вы узнаете, почему сейчас самое время начать этим заниматься.

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

- Вы узнаете, как и где найти сотрудников, как общаться с заказчиками.

- Вы узнаете, как максимально автоматизировать бизнес-процессы.

После семинара Вы уже самостоятельно сможете, следуя простому и подробному плану, открыть свою Web-студию и получить первые заказы.

Записаться

Другие курсы

Кто хочет — ищет возможности. Кто не хочет — ищет причины.

Авраам Линкольн

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

Новая тема Ответить

16.11.2013 12:43:16 Горизонтальный список Сообщение #1

th3107

Новичок

Дата регистрации:
19.07.2013 11:33:58

Сообщений: 4

Здравствуйте.Подскажите пожалуйста как можно сделать горизонтальный список на всю ширину(страницу)?

Профиль Ответить

16.11.2013 12:57:07 Горизонтальный список Сообщение #2

alexandrdante

Модератор

Дата регистрации:
15.11.2013 15:33:40

Сообщений: 207

Доброго Вам времени суток.

Просто заключите список в тег блока <div> или же создайте для него ячейку таблицы и растяните на всю ширину экрана при помощи параметра стилей width:100%;

Профиль Ответить

16.11.2013 13:14:18 Горизонтальный список Сообщение #3

th3107

Новичок

Дата регистрации:
19.07.2013 11:33:58

Сообщений: 4

<div id="menu">
<ul>
<li class="active">
<a href="#">
<span>
WEB PROFESSIONALS
</span>
</a>
</li>
<li>
<a href="#">
<span>
BUSINESS
</span>
</a>
</li>

______________________________________
#menu ul li {
float:left;
list-style:none;
text-align:justify;
}

#menu ul li a {
text-decoration:none;
padding:11px;
display:block;
color:#9c9c9c;
background-color:#2c2c2c;
}

#menu ul {
margin:0;
}

#menu ul li.active a , #menu ul li a:hover {
background-color:#111111;
}

количество пунктов 8.width:100% делаю не помогает.

Профиль Ответить

16.11.2013 13:30:54 Горизонтальный список Сообщение #4

alexandrdante

Модератор

Дата регистрации:
15.11.2013 15:33:40

Сообщений: 207

<nav>

<ol id="nav"> 

<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="#">Справочники</a></li>



</ol>

</nav>

ну и стили для правильного размещения.

<style type="text/css">

ol {

	display: table-row; /* эмуляция строки таблицы */

}

li {

	width: auto; /* чтобы поведение было аналогичным ячейки таблицы */

	display: table-cell; /* эмуляция ячейки таблицы */

	text-align: center;	

	height: 50px; /* высота пункта */

	padding-left: 2px; /* визуальная граница между пунктами меню */

	vertical-align: bottom; /* это нужно для случаев, когда в пункте меню текста больше чем на одну строку */

}

li:first-child {

	padding: 0; /* у первого элемента убираем отступ чтобы четко прилег к левой границе */

}

a {

	width: 1000px; /* вот это заставляет наши псевдоячейки растянуться должным образом */

	height: 50px;

	display: table-cell; /* без этого тоже никак */

	vertical-align: middle; /* вертикальное выравнивание текста */

}

</style>