Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.86/7: Рейтинг темы: голосов - 7, средняя оценка - 4.86
11 / 11 / 13
Регистрация: 25.04.2012
Сообщений: 1,163

Отступы

27.03.2014, 23:01. Показов 1437. Ответов 6
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
откуда такие разные отступы тем более их не указывал?)

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
<div class="header-bottom">
        <div class="container-1">
            <ul>
                <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>
            </ul>
        </div>
    </div>


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
32
33
34
35
36
37
38
39
40
41
42
.header-bottom {
    background-color:#000;
    width:100%;
    height:50px;
}
 
.container-1 {
    width:1162px;
    height: 50px;
    margin:auto;
    font-size:13px;
    font-family: 'PT Sans', sans-serif;
}
 
.container-1 ul {
    list-style: none;
}
.container-1 li {
    display:inline-block;
    text-transform: uppercase;
    width:148px;
}
 
.container-1 li a {
    border-bottom: 1px dashed #fff;
    color:#fff;
}
 
.container-1 li:first-child {
    margin:10px 0 0 0;
}
 
.container-1 li a:hover {
    font-size:13px;
    border:1px solid #fff;
    padding:3px 2px 3px 2px;
    border-radius:12px;
    background:#fff;
    text-align: center;
    color:#000;
   
}
Миниатюры
Отступы  
0
Лучшие ответы (1)
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
27.03.2014, 23:01
Ответы с готовыми решениями:

Отступы
Всем привет, помогите плиз с таким: когда я хочу сделать отступ от верхней границы окна браузера для определенного дива, то отступает не...

отступы
Здравствуйте! не могу понять, почему текст сбивается, хотя на левой стороне все нормально. в css для обеих сторон заданы одинаковые...

Отступы
Как лучше всего сделать отступы между текстами, чтобы небыло так: &lt;p&gt;...&lt;/p&gt; &lt;p&gt;...&lt;/p&gt; &lt;p&gt;...&lt;/p&gt; ...

6
11 / 11 / 13
Регистрация: 25.04.2012
Сообщений: 1,163
27.03.2014, 23:03  [ТС]
есть подозрение на вот это:

CSS
1
2
3
4
5
6
7
8
ul, menu, dir {
display: block;
list-style-type: disc;
-webkit-margin-before: 1em;
-webkit-margin-after: 1em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
-webkit-padding-start: 40px;
что это от куда этому взятся?)) пробовал обнулять типо -webit-padding-start: 0; не помогает
0
SF
Boo
142 / 117 / 55
Регистрация: 02.12.2013
Сообщений: 396
27.03.2014, 23:23
Лучший ответ Сообщение было отмечено Taatshi как решение

Решение

sendxt, если я вас правильно понял ...

CSS
1
2
3
4
5
.container-1 li {
    display:inline-block;
    text-transform: uppercase;
    width:148px; // замените на padding-right: 15px;
}
0
11 / 11 / 13
Регистрация: 25.04.2012
Сообщений: 1,163
27.03.2014, 23:30  [ТС]
мне надо каждую ячейку так сказать сделать фиксированной ширины
0
94 / 67 / 23
Регистрация: 22.09.2013
Сообщений: 626
28.03.2014, 00:43
Ну так из за этого так и получается , некоторые слова короче , некоторые длиннее и из за этого появляется пространство справа.
0
SF
Boo
142 / 117 / 55
Регистрация: 02.12.2013
Сообщений: 396
28.03.2014, 22:30
Цитата Сообщение от sendxt Посмотреть сообщение
мне надо каждую ячейку так сказать сделать фиксированной ширины
придётся вам отказаться border-bottom: 1px dashed #fff; или добавить в селектор .container-1 li
CSS
1
2
3
4
5
6
.container-1 li a {
    color:#fff;
    border:1px solid #000; /* придется спрятать в черном фоне  */
    padding:3px 2px 3px 2px; /* равняется  .container-1 li a:hover при наведение мыши */
    border-radius:12px;
}
вот полный рабочий стиль
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
32
33
34
35
36
37
38
39
40
41
42
43
44
    .header-bottom {
    background-color:#000;
    width:100%;
    height:50px;
}
 
.container-1 {
    width:1162px;
    height: 50px;
    margin:auto;
    font-size:13px;
    font-family: 'PT Sans', sans-serif;
}
 
.container-1 ul {
    list-style: none;
}
.container-1 li {
    display:inline-block;
    text-transform: uppercase;
    margin-right:15px;
}
 
.container-1 li a {
    color:#fff;
    border:1px solid #000;
    padding:3px 2px 3px 2px;
    border-radius:12px;
}
 
.container-1 li:first-child {
    margin:10px 0 0 0;
}
 
.container-1 li a:hover {
    font-size:13px;
    border:1px solid #fff;
    padding:3px 2px 3px 2px;
    border-radius:12px;
    background:#fff;
    text-align: center;
    color:#000;
   
}
0
1030 / 682 / 297
Регистрация: 04.04.2013
Сообщений: 2,751
28.03.2014, 22:32
Цитата Сообщение от sendxt Посмотреть сообщение
мне надо каждую ячейку так сказать сделать фиксированной ширины
Тут выбрать надо, либо фиксированная ширина, либо одинаковые отступы по краям слов.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
28.03.2014, 22:32
Помогаю со студенческими работами здесь

Отступы
Не понимаю, что за отступы? Убираются если на блоке установлено свойство float:left;

отступы
как реализовать равномерные отступы на картинке ниже? http://rghost.ru/49676340/image.png

Отступы
Добрый вечер! Я хотел попробовать сверстать свой одностраничный сайт чтобы попробовать что-то новое. Так как я в этом деле нуб прошу вашей...

Отступы
У меня есть элемент invalid которого так когового в коде нету он появляется при приявление ошибки(незаполеная форма) Я ему задал...

Ссылки, отступы
Года едет ряд тегов &lt;a&gt; то между ними отступ при том что margin:0 и padding:0 Можно решить путем выставления свойста float:left;,...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
7
Ответ Создать тему
Новые блоги и статьи
Конвертировать закладки radiotray-ng в m3u-плейлист
damix 19.02.2026
Это можно сделать скриптом для PowerShell. Использование . \СonvertRadiotrayToM3U. ps1 <path_to_bookmarks. json> Рядом с файлом bookmarks. json появится файл bookmarks. m3u с результатом. # Check if. . .
Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI
Eddy_Em 18.02.2026
Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .
Камера Toupcam IUA500KMA
Eddy_Em 12.02.2026
Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .
И ясному Солнцу
zbw 12.02.2026
И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.
«Знание-Сила»
zbw 12.02.2026
«Знание-Сила» «Время-Деньги» «Деньги -Пуля»
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров
8Observer8 12.02.2026
Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image)
8Observer8 11.02.2026
Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image
8Observer8 10.02.2026
Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru