- Поисковые системы
- Практика оптимизации
- Трафик для сайтов
- Монетизация сайтов
- Сайтостроение
- Социальный Маркетинг
- Общение профессионалов
- Биржа и продажа
- Финансовые объявления
- Работа на постоянной основе
- Сайты - покупка, продажа
- Соцсети: страницы, группы, приложения
- Сайты без доменов
- Трафик, тизерная и баннерная реклама
- Продажа, оценка, регистрация доменов
- Ссылки - обмен, покупка, продажа
- Программы и скрипты
- Размещение статей
- Инфопродукты
- Прочие цифровые товары
- Работа и услуги для вебмастера
- Оптимизация, продвижение и аудит
- Ведение рекламных кампаний
- Услуги в области SMM
- Программирование
- Администрирование серверов и сайтов
- Прокси, ВПН, анонимайзеры, IP
- Платное обучение, вебинары
- Регистрация в каталогах
- Копирайтинг, переводы
- Дизайн
- Usability: консультации и аудит
- Изготовление сайтов
- Наполнение сайтов
- Прочие услуги
- Не про работу
В 2023 году 36,9% всех DDoS-атак пришлось на сферу финансов
А 24,9% – на сегмент электронной коммерции
Оксана Мамчуева
Маркетинг для шоколадной фабрики. На 34% выше средний чек
Через устранение узких мест
Оксана Мамчуева
Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий
Всем привет, и снова прошу помочь..
есть кнопка, которая уже расположена по центру страницы, но центрирование происходит по левому краю кнопки, а должно быть по центру кнопки... не пойму, уже все перегуглил и перепробовал... (
HTML
<meta charset="utf-8">
<link href="css.css" rel="stylesheet">
<div class="background">
<div><a href="" class="knopka">Посмотреть фото-портфолио</a></div>
</div>
CSS
a.knopka {
color: 69cd92; /* цвет текста */
text-decoration: none; /* убирать подчёркивание у ссылок */
user-select: none; /* убирать выделение текста */
border: 2px solid #69cd92; /* ѕараметры рамки */
border-radius: 6px;
padding: 6px 18px; /* отступ от текста */
outline: none; /* убирать контур в Mozilla */
font-family: Open Sans;
font-size: 24pt;
font-weight: lighter;
text-transform: uppercase;
position : absolute;
}
a.knopka:hover { border: 2px solid #8fecb5; color: 8fecb5; } /* при наведении курсора мышки */
a.knopka:active { border: 2px solid #69a483; color: 69a483; } /* при нажатии */
Непонятно что вы хотите, что и где центрируется..
position : absolute; - без указания позиции должно центрировать сверху слева.
Непонятно что вы хотите, что и где центрируется..
position : absolute; - без указания позиции должно центрировать сверху слева.
я вложил картинку как это выглядит у меня. центрирование тут происходит с помощью
display: flex;
align-items: center;
justify-content: center;
Но я пробовал и <center> и text-align: center в css прописывать всему файлу, и отдельным блокам - результат один и тот же - как на картинке
---------- Добавлено 05.03.2016 в 19:20 ----------
В общем мне нужно чтобы css кнопка стояла ровно по центру экрана, и оставалась всегда по центру окна, но я не понимаю как это сделать
Может подойдет?
display: block;
margin: 0, auto;
Не вполне понятно, что и куда вы хотите центровать?
Может подойдет?
display: block;
margin: 0, auto;
Не вполне понятно, что и куда вы хотите центровать?
да куда ж понятнее.. я же подробно расписал: кнопка должна быть по центру страницы, всегда, даже когда размер окна изменяется - тоже.
так уберите position: absolute
а если сильно надо то отцентрируйте так
left: calc(50% - x)
x - половина ширины кнопки
Отправлено с моего Lenovo A820 через Tapatalk
.background{
float: left;
width: 100%;
text-align: center;
}
a.knopka {
color: 69cd92; /* цвет текста */
text-decoration: none; /* убирать подчёркивание у ссылок */
user-select: none; /* убирать выделение текста */
border: 2px solid #69cd92; /* ѕараметры рамки */
border-radius: 6px;
padding: 6px 18px; /* отступ от текста */
outline: none; /* убирать контур в Mozilla */
font-family: Open Sans;
font-size: 24pt;
font-weight: lighter;
text-transform: uppercase;
display: inline-block;
}
delad,
<!DOCTYPE html>
<html>
<head>
<title>Центрируем кнопочку</title>
</head>
<body>
<style>
body, html {
margin: 0;
padding: 0;
height: 100%;
width: 100%;
}
.parent {
height: 100%;
width: 100%;
display: flex;
}
.child{
margin: auto;
}
button#btn {
padding: 10px;
border: 1px solid black;
border-radius: 4px;
}
</style>
<div class="parent">
<div class="child">
<button id="btn">Кнопочка</button>
</div>
</div>
</body>
</html>
Всем большое спасибо за помощь, разобрался)