Страница 15 из 15
Re: [3.1] [FAQ] Шаблон форума, CSS и html, где что "ковырять"
Добавлено: 07.11.2018 21:14
Aleksej2000
Такая ситуация: кнопки пагинации многостраничных тем на странице списка тем сделал в виде капли. Использовал код
Код: Выделить всё
width: 12px;
height: 12px;
border-radius: 80% 0 55% 50% / 55% 0 80% 50%;
border: 1px solid;
transform: rotate(-45deg);
margin-top: auto;
Но образовалась проблема: числа тоже повернуты на 45 градусов. Возможно ли
transform: rotate
использовать для шрифта, отдельно от контура, только повернуть числа внутри капли по часовой стрелке? Или отдельно контур и внутреннее содержимое не реализовать?
Re: [3.1] [FAQ] Шаблон форума, CSS и html, где что "ковырять"
Добавлено: 07.11.2018 21:43
Татьяна5
Можно применять свойства к разным элементам (те же кнопки - это li
, а внутри у них есть ещё a
)
Re: [3.1] [FAQ] Шаблон форума, CSS и html, где что "ковырять"
Добавлено: 07.11.2018 22:06
Aleksej2000
Татьяна5 писал(а): ↑07.11.2018 21:43
а внутри у них есть ещё a)
Да вроде я пробовал отделить элемент с
а
и к нему применить поворот в другую сторону, не получилось. Применяется поворот наружнего элемента. Видимо что-то не так делаю.
Re: [3.1] [FAQ] Шаблон форума, CSS и html, где что "ковырять"
Добавлено: 12.11.2018 3:25
Aleksej2000
Татьяна5 писал(а): ↑07.11.2018 21:43
Можно применять свойства к разным элементам (те же кнопки - это
li
, а внутри у них есть ещё
a
)
Подскажите, как повернуть цифры внутри капли?
Код: Выделить всё
.row .pagination {
display: block;
margin-top: 0;
padding: 1px 0 1px 15px;
font-size: 0.7em;
background: none 0 50% no-repeat;
}
.row .pagination > ul {
margin: 0;
}
.row .pagination li a, .row .pagination li span {
width: 12px;
height: 12px;
border-radius: 80% 0 55% 50% / 55% 0 80% 50%;
border: 1px solid;
transform: rotate(-45deg);
margin-top: auto;
}
Сейчас с указанным кодом выглядит вот так
Re: [3.1] [FAQ] Шаблон форума, CSS и html, где что "ковырять"
Добавлено: 12.11.2018 5:05
Татьяна5
Перенести border
и его трансформацию на li
, а на a
повернуть обратно. Либо добавлять ещё один уровень тегов в шаблоне
Re: [3.1] [FAQ] Шаблон форума, CSS и html, где что "ковырять"
Добавлено: 12.11.2018 8:53
Aleksej2000
Я вроде пробовал и так и этак, не получается.
Татьяна5, а не могли бы Вы, пожалуйста, выше указанный код поправить, как нужно (предположительно), попробую его вставить. Если не получится, буду изучать, как добавить в шаблон еще уровень тегов
Re: [3.1] [FAQ] Шаблон форума, CSS и html, где что "ковырять"
Добавлено: 12.11.2018 9:05
Татьяна5
.row .pagination li a, .row .pagination li span
заменить в нескольких местах на
.row .pagination li
(всё для
border
'а и фона)
Код: Выделить всё
.row .pagination li a, .row .pagination li span {
transform: rotate(45deg);
display: block;
}
И работать дальше над размерами, выравниванием, и т.д.
Re: [3.1] [FAQ] Шаблон форума, CSS и html, где что "ковырять"
Добавлено: 12.11.2018 10:12
Aleksej2000
Татьяна5 писал(а): ↑12.11.2018 9:05
.row .pagination li a, .row .pagination li span заменить в нескольких местах на .row .pagination li (всё для border'а и фона)
Не, это выше моих познаний
Я пробовал отдельно
.row .pagination li
и все остальные элементы поворачивать по часовой и против часовой за счет знака перед
45deg
. Увы, цифры крутятся вместе со всем. Отдельно внутренний элемент с цифрами не крутится почему-то. Поэтому и просил дать готовый код, где что подправить. Моих познаний не хватает пока что
Re: [3.1] [FAQ] Шаблон форума, CSS и html, где что "ковырять"
Добавлено: 12.11.2018 10:35
Татьяна5
В моём примере крутится отдельно (переименовывала через отладчик)
Re: [3.1] [FAQ] Шаблон форума, CSS и html, где что "ковырять"
Добавлено: 13.11.2018 1:17
Aleksej2000
Ну видимо, я что-то не так делаю, не получается. Ладно, как есть, так и пусть будет, ибо это мне "не по зубам".