Мифтахов Валерий#75
Conversation
|
🍏 Пройден линтинг и базовые тесты |
|
🍏 Пройден линтинг и базовые тесты |
Mokoshka
left a comment
Mokoshka
left a comment
There was a problem hiding this comment.
- Хочется, чтобы заголовок не переносился
- При наведении на label для выбора стиля хочется, чтобы курсор изменялся. Так будет понятно, что элемент интерактивный
index.css
Outdated
| column-rule: 1px solid #fff; | ||
| } | ||
|
|
||
| .labelButton |
There was a problem hiding this comment.
Принято названия классов указывать через дефиз: label-button
index.css
Outdated
| font-family: Arial; | ||
| text-align: center; | ||
| column-count: 3; | ||
| padding: 50 0; |
| .labelButton | ||
| { | ||
| line-height: 3em; | ||
| font-family: Arial; |
There was a problem hiding this comment.
Стоит указать "запасным" шрифтом шрифт без засечек (sans-serif). Это нужно для того, чтобы в случае, если шрифта у пользователя нет, браузер подставил свой с указанным начертанием
index.html
Outdated
| <br> | ||
| <label for="black_and_white">Тема 1</label> | ||
| <label for="white_and_black">Тема 2</label> | ||
| <br> |
There was a problem hiding this comment.
Давай сделаем этот блок без использования br
index.html
Outdated
| <h1>Newspaper - fish</h1> | ||
| <section> | ||
| <div class="picture"> | ||
| <img src="picture.png" alt="picture"> |
| <div class="picture"> | ||
| <img src="picture.png" alt="picture"> | ||
| </div> | ||
| <article class="article2"> |
There was a problem hiding this comment.
Кажется, этот класс нигде не используется
There was a problem hiding this comment.
Добрый день, спасибо, что проверили :-) . Правильно ли я Вас понимаю, классы должны присутствовать только там, где они используются? "Хочется, чтобы заголовок не переносился" - выполнил только для h1, так как у h2 длинные заголовки, если только скрывать лишнее, но тогда теряется смысловая информация.
There was a problem hiding this comment.
Зачем указывать класс, к которому ты никак не привязываешься? У него нет стилей в твоем css.
У колонок есть много интересных свойств. Например, одно из них break-inside. Попробуй, может поможет решить проблему с заголовками без скрытия лишнего
index.css
Outdated
| text-indent: 2em; | ||
| } | ||
|
|
||
| input[value='smoll']:checked ~ main |
index.css
Outdated
|
|
||
| input[value='TrixieCyr-Plain']:checked ~ main | ||
| { | ||
| font-family: TrixieCyr-Plain; |
There was a problem hiding this comment.
Лучше указывать названия шрифтов единым стилем, сейчас они разные. И указать дополнительные шрифты на случай, если эти по каким-либо причинам не подгрузятся
|
🍏 Пройден линтинг и базовые тесты |
|
🍏 Пройден линтинг и базовые тесты |
|
|
||
| html | ||
| { | ||
| background-color: gray; |
There was a problem hiding this comment.
Вот здесь еще затесалось название цвета
|
|
||
| h1 | ||
| { | ||
| white-space: nowrap; |
There was a problem hiding this comment.
Плохое решение, потому что h1 может занять больше, чем одну строчку. Например
|
|
||
| h3 | ||
| { | ||
| white-space: nowrap; |
3 participants
Посмотреть решение