Фиксация кнопок

@NTGhsot · Регистрация: 12.10.2019

Студворк — интернет-сервис помощи студентам

Кнопки постоянно отталкиваются друг от друга из-за padding , а при написании position:fixed;
Собираются в одну кучу.(Решение возможно очень простое , но я его не вижу) Помогите пожалуйста.
Вот код css
.navig{
padding-top: 60px;
font-family: 'Titillium Web', sans-serif;
font-size:16px;
text-transform:uppercase;
}
.nav_link{
color: #fff;
text-decoration:none;
vertical-align: top;
margin: 0 20px;
}

.nav_link:hover{
background-color: #643a79;
border-radius: 3px;
padding-left: 13px;
padding-right: 13px;
padding-top: 5px;
padding-bottom: 5px;

}
html(Только сами кнопки)
<nav class="navig">
<a class="nav_link " href="#">Home</a>
<a class="nav_link " href="#"> About </a>
<a class="nav_link " href="#"> Work </a>
<a class="nav_link " href="#"> Blog </a>
<a class="nav_link " href="#"> Contact </a>
</nav>

Добавлено через 29 минут
https://jsfiddle.net/ps86qugd/1/

@dansdasaf · 13.10.2019, 11:07

Попробуйте так:

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
.nav_link{
color: #fff;
text-decoration:none;
vertical-align: top;
margin: 0 20px;
border-radius: 3px;
padding-left: 13px;
padding-right: 13px;
padding-top: 5px;
padding-bottom: 5px;
}
 
.nav_link:hover{
background-color: #643a79;
}

@NTGhsot · 13.10.2019, 12:43 **[ТС]**

Спасибо , всё получилось.

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): сборка C/C++ проекта из консоли 8Observer8 30.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .	Установка Emscripten SDK (emsdk) и CMake на Windows для сборки C и C++ приложений в WebAssembly (Wasm) 8Observer8 30.01.2026 Чтобы скачать Emscripten SDK (emsdk) необходимо сначало скачать и уставить Git: Install for Windows. Следуйте стандартной процедуре установки Git через установщик. Система контроля версиями Git. . .	Подключение Box2D v3 к SDL3 для Android: физика и отрисовка коллайдеров 8Observer8 29.01.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами. Версия v3 была полностью переписана на Си, в. . .	Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT bedvit 28.01.2026 Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .
Загрузка PNG с альфа-каналом на SDL3 для Android: с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 28.01.2026 Содержание блога SDL3 имеет собственные средства для загрузки и отображения PNG-файлов с альфа-каналом и базовой работы с ними. В этой инструкции используется функция SDL_LoadPNG(), которая. . .	Загрузка PNG с альфа-каналом на SDL3 для Android: с помощью SDL3_image 8Observer8 27.01.2026 Содержание блога SDL3_image - это библиотека для загрузки и работы с изображениями. Эта пошаговая инструкция покажет, как загрузить и вывести на экран смартфона картинку с альфа-каналом, то есть с. . .	Влияние грибов на сукцессию anaschu 26.01.2026 Бифуркационные изменения массы гриба происходят тогда, когда мы уменьшаем массу компоста в 10 раз, а скорость прироста биомассы уменьшаем в три раза. Скорость прироста биомассы может уменьшаться за. . .	Воспроизведение звукового файла с помощью SDL3_mixer при касании экрана Android 8Observer8 26.01.2026 Содержание блога SDL3_mixer - это библиотека я для воспроизведения аудио. В отличие от инструкции по добавлению текста код по проигрыванию звука уже содержится в шаблоне примера. Нужно только. . .

@NTGhsot 0 / 0 / 0 Регистрация: 12.10.2019 Сообщений: 2

	Фиксация кнопок 12.10.2019, 21:25. Показов 2339. Ответов 2 Метки css, html, html5 (Все метки) Кнопки постоянно отталкиваются друг от друга из-за padding , а при написании position:fixed; Собираются в одну кучу.(Решение возможно очень простое , но я его не вижу) Помогите пожалуйста. Вот код css .navig{ padding-top: 60px; font-family: 'Titillium Web', sans-serif; font-size:16px; text-transform:uppercase; } .nav_link{ color: #fff; text-decoration:none; vertical-align: top; margin: 0 20px; } .nav_link:hover{ background-color: #643a79; border-radius: 3px; padding-left: 13px; padding-right: 13px; padding-top: 5px; padding-bottom: 5px; } html(Только сами кнопки) <nav class="navig"> <a class="nav_link " href="#">Home</a> <a class="nav_link " href="#"> About </a> <a class="nav_link " href="#"> Work </a> <a class="nav_link " href="#"> Blog </a> <a class="nav_link " href="#"> Contact </a> </nav> Добавлено через 29 минут https://jsfiddle.net/ps86qugd/1/ 0

@NTGhsot 0 / 0 / 0 Регистрация: 12.10.2019 Сообщений: 2
	13.10.2019, 12:43 [ТС]
	Спасибо , всё получилось. 0