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

Расположение текста на кнопке

22.11.2021, 20:57. Показов 1652. Ответов 3

Студворк — интернет-сервис помощи студентам
Как сделать так, чтоб текст на кнопке был не по центру, а на требуемом мне расстоянии от левого края кнопки, padding не помогал, спасибо)


HTML5
1
<button class="button" type="submit">full story</button>
CSS
1
2
3
4
5
6
7
8
9
10
.button {
   font-size: 15px;
   text-transform: uppercase;
   color: rgb(255, 255, 255);
   background-color: rgb(65, 111, 180);
   width: 199px;
   height: 44px;
   border-radius: 22px;
   box-shadow: 2px 2px 2px 2px rgba(65, 105, 225, 0.493);
}
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
22.11.2021, 20:57
Ответы с готовыми решениями:

Расположение текста
Доброе время суток! Такая проблема: Есть див. Его стиль font-size: 15px; margin-left: 5px; внутри располагается текст. При...

Расположение текста
Здравствуйте! Есть текст: ФИО: Иванов И.В. Номер телефона: 88005553535 Этот текст находится в блоке div. Они должны быть...

расположение текста
Всем привет! У меня такая задача, нужно текст расположить в начале кода, т.е. сразу под открывающимся тегом бади, а на экран выводить...

3
 Аватар для NTHing
1782 / 963 / 388
Регистрация: 26.11.2014
Сообщений: 1,966
Записей в блоге: 1
22.11.2021, 21:47
Цитата Сообщение от sergei288 Посмотреть сообщение
padding не помогал
может попробовать padding-left, или padding-right?
0
0 / 0 / 0
Регистрация: 22.11.2021
Сообщений: 2
22.11.2021, 21:56  [ТС]
padding-left прижимает к краю, а мне надо на определённое расстояние от края кнопки.
0
Модератор
Эксперт HTML/CSS
 Аватар для AlexZaw
2380 / 1740 / 677
Регистрация: 07.08.2016
Сообщений: 4,094
23.11.2021, 11:33
sergei288, костыль конечно, но можно так:
CSS
1
2
3
4
5
.button {
  text-align: left;
  padding: 0;
  padding-left: 20px
}
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
23.11.2021, 11:33
Помогаю со студенческими работами здесь

Расположение текста на странице
Всем доброго времени суток. Есть фон для сайта. Но есть проблема с размещением теста, информации и всего прочего составляющего темы сайта. ...

Расположение текста в таблице
Здравствуйте, только не смейтесь. В html мягко сказать не бум-бум, стал делать таблицу (1 рис) по инструкции по html, но получается совсем...

Расположение текста в хедере
Всем привет! Использую WordPress. В header.php дописал строчку с текстом и ссылкой, но отображаются они не там где мне нужно. Понимаю, что...

Расположение текста в div
Есть контейнер div, в котором ещё два div. Для первого задан размер и фоновая картинка. Второй содержит текст (&lt;p&gt; ). Размер...

Расположение изображения и текста
Здравствуйте. Как сделать чтобы под изображением был текст выравненный относительно изображения по середине и чтобы такие пары...


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

Или воспользуйтесь поиском по форуму:
4
Ответ Создать тему
Новые блоги и статьи
SDL3 для Desktop (MinGW): Создаём пустое окно с нуля для 2D-графики на SDL3, Си и C++
8Observer8 10.03.2026
Содержание блога Финальные проекты на Си и на C++: hello-sdl3-c. zip hello-sdl3-cpp. zip Результат:
Установка CMake и MinGW 13.1 для сборки С и C++ приложений из консоли и из Qt Creator в EXE
8Observer8 10.03.2026
Содержание блога MinGW - это коллекция инструментов для сборки приложений в EXE. CMake - это система сборки приложений. Здесь описаны базовые шаги для старта программирования с помощью CMake и. . .
Как дизайн сайта влияет на конверсию: 7 решений, которые реально повышают заявки
Neotwalker 08.03.2026
Многие до сих пор воспринимают дизайн сайта как “красивую оболочку”. На практике всё иначе: дизайн напрямую влияет на то, оставит человек заявку или уйдёт через несколько секунд. Даже если у вас. . .
Модульная разработка через nuget packages
DevAlt 07.03.2026
Сложившийся в . Net-среде способ разработки чаще всего предполагает монорепозиторий в котором находятся все исходники. При создании нового решения, мы просто добавляем нужные проекты и имеем. . .
Модульный подход на примере F#
DevAlt 06.03.2026
В блоге дяди Боба наткнулся на такое определение: В этой книге («Подход, основанный на вариантах использования») Ивар утверждает, что архитектура программного обеспечения — это структуры,. . .
Управление камерой с помощью скрипта OrbitControls.js на Three.js: Вращение, зум и панорамирование
8Observer8 05.03.2026
Содержание блога Финальная демка в браузере работает на Desktop и мобильных браузерах. Итоговый код: orbit-controls-threejs-js. zip. Сканируйте QR-код на мобильном. Вращайте камеру одним пальцем,. . .
SDL3 для Web (WebAssembly): Синхронизация спрайтов SDL3 и тел Box2D
8Observer8 04.03.2026
Содержание блога Финальная демка в браузере. Итоговый код: finish-sync-physics-sprites-sdl3-c. zip На первой гифке отладочные линии отключены, а на второй включены:. . .
SDL3 для Web (WebAssembly): Идентификация объектов на Box2D v3 - использование userData и событий коллизий
8Observer8 02.03.2026
Содержание блога Финальная демка в браузере. Итоговый код: finish-collision-events-sdl3-c. zip Сканируйте QR-код на мобильном и вы увидите, что появится джойстик для управления главным героем. . . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru