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

Как выровнять строчные картинки по центру?

24.01.2018, 23:03. Показов 1583. Ответов 5
Метки css, html (Все метки)

Студворк — интернет-сервис помощи студентам
Не могу выровнять все картинки по центру, получается только как на картинке, хэлп!


Вот код:
HTML

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Positive schizophrenia</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
<!--logo-->
    <div class="LOGO">
        <a href=#><img src="LOGO.png"></a>
    </div>
<!--buttons and lines-->
    <hr>
        <a href=# class="games"></a>
        <a href=# class="blog"> </a>
        <a href=# class="about"></a>
        <a href=# class="contact"></a>
    <hr>
</body>
</html>
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
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
.LOGO
{
        text-align: center;
}
a.games
{
        background: url(Games.png);
        width: 150px;
        height: 60px;
        display: inline-block;
        margin: 0 auto ;
}
a.games:hover
{
        background: url(Games_Hover.png);
}
a.blog
{
        background: url(Blog.png);
        width: 150px;
        height: 60px;
        display: inline-block;
}
a.blog:hover
{
        background: url(Blog_Hover.png)
}
a.about
{
        background: url(Blog.png);
        width: 150px;
        height: 60px;
        display: inline-block;
}
a.about:hover
{
        background: url(Blog_Hover.png)
}
a.about
{
        background: url(About.png);
        width: 150px;
        height: 60px;
}
a.about:hover
{
        background: url(About_Hover.png)
}
a.contact
{
        background: url(Contact.png);
        width: 150px;
        height: 60px;
        display: inline-block;
}
a.contact:hover
{
        background: url(Contact_Hover.png)
}
hr
{
        border: none;
        background-color: black;
        height: 4px;
}
0
Лучшие ответы (1)
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
24.01.2018, 23:03
Ответы с готовыми решениями:

Необходимо сделать круглые углы у картинки и выровнять её по центру
Всем здравствуйте! У меня такой вопрос, в общем я задаю блоку где будет находится картинка фиксированную ширину, и максимально допустимую...

Как выровнять по центру h2?
Чтоб блок с картинками был на следующей линии? &lt;div class=&quot;third&quot;&gt; &lt;div class=&quot;subscribe&quot;&gt; ...

Как выровнять по центру?
Народ подскажите! как цифру 1 выровнять по центру блока, высота которого будет динамична

5
Эксперт JSЭксперт HTML/CSS
 Аватар для mrtoxas
3827 / 2677 / 1521
Регистрация: 12.07.2015
Сообщений: 6,672
Записей в блоге: 4
25.01.2018, 00:25
HTML5
1
2
3
4
5
6
7
8
<!--buttons and lines-->
    <nav class="main-nav">
        <a href=# class="games">1</a>
        <a href=# class="blog">1 </a>
        <a href=# class="about">1</a>
        <a href=# class="contact">1</a>
    <nav>
</body>
CSS
1
2
3
4
5
.main-nav{
  text-align:center;
  border-top:4px solid black;
  border-bottom:4px solid black;
}
И без hr.
0
0 / 0 / 0
Регистрация: 24.01.2018
Сообщений: 3
25.01.2018, 15:17  [ТС]


Не работает, закрывающие body и html горят красным ;(
0
Эксперт JSЭксперт HTML/CSS
 Аватар для mrtoxas
3827 / 2677 / 1521
Регистрация: 12.07.2015
Сообщений: 6,672
Записей в блоге: 4
25.01.2018, 15:30
Лучший ответ Сообщение было отмечено KataLv как решение

Решение

Это я о чем-то задумался, видимо, не о том Закройте nav тэг
HTML5
1
2
3
4
5
6
7
8
<!--buttons and lines-->
    <nav class="main-nav">
        <a href=# class="games"></a>
        <a href=# class="blog"></a>
        <a href=# class="about"></a>
        <a href=# class="contact"></a>
    </nav>
</body>
1
333 / 309 / 168
Регистрация: 02.06.2014
Сообщений: 1,130
25.01.2018, 15:31
Цитата Сообщение от KataLv Посмотреть сообщение
Не работает, закрывающие body и html горят красным ;(
тег <nav></nav> закройте, косую забыли
1
0 / 0 / 0
Регистрация: 24.01.2018
Сообщений: 3
25.01.2018, 15:57  [ТС]
Спасибо, теперь всё работает
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
25.01.2018, 15:57
Помогаю со студенческими работами здесь

Как выровнять меню по центру?
Не могу понять, как выровнить меню по центру с применением align-items: center и justify-content: space-between: &lt;div...

Как выровнять 1 блок по центру
Есть код &lt;div class=&quot;head-content&quot;&gt; &lt;div class=&quot;left-top&quot;&gt; &lt;h1&gt;Lorem ipsum dolor sit amet&lt;/h1&gt; &lt;p&gt;Lorem ipsum...

Как выровнять body по центру?
Эм, как лошара не могу выровнить body по центру. Уже пробовал через margin, float, text-align, font-align, не хочет и всё &gt;_&lt;

Как выровнять по центру блок
Здравствуйте! Подскажите пожалуйста как можно выровнять блок по центру? Применяла margin:0 auto но ничего не меняется, если просто делаю...

Как выровнять сайт по центру?
Подскажите пожалуйста как можно выровнять сайт по центру экрана монитора, а то у меня монитор шырокоугольный и весь сайт выравнивается по...


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

Или воспользуйтесь поиском по форуму:
6
Ответ Создать тему
Новые блоги и статьи
SDL3 для Web (WebAssembly): Реализация движения на Box2D v3 - трение и коллизии с повёрнутыми стенами
8Observer8 20.02.2026
Содержание блога Box2D позволяет легко создать главного героя, который не проходит сквозь стены и перемещается с заданным трением о препятствия, которые можно располагать под углом, как верхнее. . .
Конвертировать закладки 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. Пошагово создадим проект для загрузки изображения. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru