Рахимянов Эмиль#11
Conversation
|
🍅 Не пройден линтинг или базовые тесты |
|
🍏 Пройден линтинг и базовые тесты |
| <body> | ||
| <main> | ||
| <h1>Lorem Ipsum</h1> | ||
| <div class="firstLine"> |
There was a problem hiding this comment.
Может быть можно использовать что-то более семантичное?
| </article> | ||
| <article> | ||
| <h3>Section 1.10.32 of "de Finibus Bonorum et Malorum", written by Cicero in 45 BC</h3> | ||
| <div class="vertical"> |
There was a problem hiding this comment.
И здесь можно использовать более семантичный элемент
| dolorem eum fugiat quo voluptas nulla pariatur? | ||
| </p> | ||
| <figure> | ||
| <img src="lenna.jpg" alt="lenna.jpg"> |
| word-break: break-all; | ||
| border-radius: 5px; | ||
| border: 1px solid black; | ||
| height: auto; |
| width: 1em; | ||
| word-break: break-all; | ||
| border-radius: 5px; | ||
| border: 1px solid black; |
| letter-spacing: .2em; | ||
| margin: 10px; | ||
| padding: 3px; | ||
| font-family: 'Abril Fatface'; |
There was a problem hiding this comment.
Ты используешь шрифты, которые не подключил. У меня, например, они не отображаются)
| font-family: 'HFF Clip Hanger'; | ||
| } | ||
|
|
||
| article:nth-child(1) > h3 |
There was a problem hiding this comment.
Почему бы просто не задать класс, который определяет шрифт? Что-то типа .font-bobo-dylan. Тогда, если ты захочешь еще в каком то элементе использовать шрифт, тебе надо будет всего лишь указать класс нужный.
Предлагаю все селекторы с nth-child переписать таким образом
|
🍏 Пройден линтинг и базовые тесты |
|
🍅 Не пройден линтинг или базовые тесты |
|
🍏 Пройден линтинг и базовые тесты |
Mokoshka
left a comment
Mokoshka
left a comment
There was a problem hiding this comment.
Заголовок в конце колонки выглядит не очень. Давай сделаем так, чтобы заголовок всегда был в одной колонке со своей статьей
| border-top: 1px #000 solid; | ||
| } | ||
|
|
||
| section article:nth-child(2n+1) blockquote |
There was a problem hiding this comment.
Здесь nth-child оставил. Использование класса значительно упростит селектор и повторное использование таких границ. Например, понадобится использовать такой стиль в другом порядке и тогда надо будет лишь проставить классы у нужных элементов, а не менять селектор. Ведь изменить класс проще?
| word-break: break-all; | ||
| border-radius: 5px; | ||
| border: 1px solid #000; | ||
| height: auto; |
There was a problem hiding this comment.
Объясни, пожалуйста, зачем ты здесь используешь height: auto?
|
|
||
| .vertical | ||
| { | ||
| display: inline-block; |
There was a problem hiding this comment.
А зачем этот элемент делать инлайновым?
| <head> | ||
| <meta charset="utf-8"> | ||
| <title>Задача «DeLorean DMC-12»</title> | ||
| <link href="http://tinyurl.com/ycoym3ls" rel="stylesheet"> |
There was a problem hiding this comment.
А давай не будем пользоваться чем-то уже готовым, а сами подключим нужные тебе шрифты. Пока что это курсы и здесь надо научиться понимать как все работает
There was a problem hiding this comment.
Там используются как шрифты из репозитория так и с гугла
There was a problem hiding this comment.
Не вижу в этом проблемы. Почему бы просто не подключить те же шрифты?
|
🍅 Не пройден линтинг или базовые тесты |
|
🍅 Не пройден линтинг или базовые тесты |
|
🍏 Пройден линтинг и базовые тесты |
|
Помоги пожалуйста с заголовком в конце колонки. Я пробовал break-after, но он в firefox не работает(( Пробовал article {display:inline-block}, но тогда внутри нет переносов( |
|
|
🍅 Не пройден линтинг или базовые тесты |
3 participants
Посмотреть решение