Как сделать расстояние между кнопками в css
Сообщений: 8
Задать расстояние между кнопками?
Подскажите как задать расстояние между кнопками не сдвигая их в лево ?
Пробовала margin: 2px; но так они сдвигаются левее и в низ?
.button-origin
echo ' :sort_tab_len('.$totalRows_Recordset1.', \'data\', \'\', \'0\', 1)">Дата'; echo ' :sort_tab_len('.$totalRows_Recordset1.', \'f_cena_\', \'\', \'0\', 1)">Цена';if($totalRows_Recordset1) :sort_tab_len('.$totalRows_Recordset1.', \'data\', \'\', \'-1\', '.$orders.')"> ".$fww.""; > else echo ' :sort_tab_len('.$totalRows_Recordset1.', \'data\', \'\', \'-1\', 1)"> ".$fww.""; > else echo ' :sort_tab_len('.$totalRows_Recordset1.', \'f_cena_\', \'\', \'-1\', 1)">
Изображения
Image 11.png (5.9 Кб, 368 просмотров)
Пользователь
Регистрация: 15.05.2018
Сообщений: 75
Попробуйте margin-right:2px; или сколько пикселей Вам нужно. Когда Вы прописываете margin:2px; то получаете отступ по 2 пикселя со всех сторон, поэтому кнопки и убегают.
Не задавай вопрос, если не знаешь что делать с ответом.
Как расширить расстояние между кнопками меню? - Joomla 1.5: Вопросы по работе с меню
Сегодня важный день для проекта Joomla! Мы отмечаем два года напряженной работы наших добровольцев, решивших выпускать новую основную версию каждые два года. После большого количества обсуждений, спринтов по написанию кода и устранения ошибок этот день наконец настал и мы с гордостью объявляем о выпуске новой мажорной ( major ) версии Joomla 5.0, наряду с Joomla 4.4.
В Joomla Extensions Directory появился тег совместимости с Joomla 5.
Joomla-разработчики, проверившие совместимость своих расширений с Joomla 5 могут поставить галочку ��
JoomlaDay Spain, Madrid.
В Мадриде, Испания 5-6 октября 2023 года проходит Joomla Day - конференция, посвящённая как новичкам, так и профессионалам, работающим с Joomla.
Как изменить расстояние между кнопками?
Всем привет! Возникли проблемы с кнопками. Мне нужно, как-то изменить расстояние между ними (на картинке) после отступа от левой стороны страницы.
Буду благодарен за полезные советы!
.btn < height:100px; width:100px; border-color:#c2e254 #9bb838 #9bb838 #c2e254; border-style:solid; border-width:1px; background:#c2e254; cursor:pointer; width: 20%; border-radius: 4px; margin-left:100px; margin-top:50px; color: #000000; font-size: 15px; font-family: helvetica, serif; text-decoration: none; vertical-align: middle; >.btn:hover < border-color:#FFCC66 #FFFF99 #FFFF99 #FFCC66; border-style:solid; border-width:1px; background:#FFFF99; >.btn:focus < background:#ddd; border-color:#ddd #333 #333 #ddd; border-style:solid; border-width:1px; >.btn:active
- Вопрос задан более трёх лет назад
- 18715 просмотров
Комментировать
Решения вопроса 1
Gabaruto @Gabaruto Автор вопроса
Сам нашёл.
margin-left: - это расстояние между ними
position: relative;
top: 50px;
left: 50px; - расстояние от края
Ответ написан более трёх лет назад
Комментировать
Нравится Комментировать
Расстояние между кнопками и анимация
Как увеличить расстояние между кнопками, например в 10px? Для увеличения расстояния между кнопками на 10px можно использовать CSS свойство margin . Например, если у вас есть кнопки с классом button , то вы можете добавить следующее правило в ваш CSS файл:
Это добавит отступ справа от каждой кнопки в размере 10px. Если вы хотите увеличить расстояние между всеми кнопками, то можете использовать селектор button без класса:
Но помните, что изменение стилей может повлиять на внешний вид вашего сайта, поэтому будьте осторожны и проверяйте результаты изменений перед публикацией.
А как же добавить еще и анимацию, чтобы при наведении курсора на кнопку в десктопной версии она немного увеличивалась бы в размере?
Для добавления анимации при наведении на кнопку, вы можете использовать CSS свойство transform и псевдокласс :hover . Например, если у вас есть кнопки с классом button , то вы можете добавить следующее правило в ваш CSS файл:
css
.button:hover transform: scale(1.1);
>
Это добавит анимацию увеличения размера кнопки на 10% при наведении на нее курсора мыши. Если вы хотите изменить продолжительность анимации, то можете использовать свойство transition . Например:
css
.button transition: transform 0.3s ease-in-out;
>
.button:hover transform: scale(1.1);
>
Это добавит плавную анимацию увеличения размера кнопки на 10% за 0.3 секунды с эффектом замедления в начале и в конце анимации.