8. Испытание: Фильмография

Курсы Микросетки
1

Вот решение, если кому интересно.

.movie {
  display: grid;
  grid-template-columns: 1fr 235px;
  align-items: center;
  margin-bottom: 10px;
}

.tags-list {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  padding: 15px;
}

.tag-link {
  display: block;
  padding: 5px 10px;
}

.tag {
  margin: 5px;
}
4 лайка
2

У меня даже так не работает. Хотя в мини-браузере картинка совпадает с образцом, результат не засчитывается.

3

001
001855×890 68.8 KB

4

002
002856×884 73.4 KB

а вот так показывает в результате

5

Добавьте
.body{margin:0;
padding:0;} тогда 100%

6

тоже не помогает.

7

Код точно совпадает? Особенно касается маржинов и паддингов.

8

@Zetter Первый раз когда смотрела, все вроде тоже самое было плюс еще указывала margin: 0 для body. Но потом уже видимо столько всего крутила. Короче сегодня просто скопировала ваш код. Вышли 100%. Спасибо, но буду теперь разбираться чего я там намудрила :crazy_face:

9

.movie {
display: grid;
grid-template-columns: 1fr 235px;
align-items: center;
margin-bottom: 10px;

}
.tag-list {
display: flex;
flex-wrap: wrap;
margin: 0;
padding: 15px;
}

.tag-link {
display: block;
padding: 5px 10px;
}
.tag {
margin: 5px;
}
блин все в точности как у тебя а все равно не проходит, не вижу в чем косяк? помогите пожалуйста

10

Опечатка, tags-list

11

Спасибо, проглядел))

12

body {
margin: 0;

}
.movie {
display: grid;
grid-template-columns: 1fr 235px;
margin-bottom: 10px;
align-items: center;
}

.tags-list {
display: flex;
flex-wrap: wrap;
margin: 0;
padding: 15px;
}
.tag-link {
display: block;
padding: 5px 10px;
}
.tag {
margin: 5px;
}

13

body{
margin:0;
}
.movie{
display: grid;
grid-template-columns: 1fr 235px;
margin-bottom: 10px;
align-items: center;
}
.tags-list{
display:flex;
flex-wrap:wrap;
margin:0;
padding:15px;

}
.tag{
margin: 5px;
}
.tag-link{
display:block;
padding: 5px 10px;
}

14

Единственное испытание CSS, которое я прошёл с первого раза :star_struck:

    body {
  margin: 0;
  
}
.movie {
  display: grid;
  grid-template-columns: 1fr 235px;
  margin-bottom: 10px;
  align-items: center;
}
.movie-title {
  
}
.tags-list {
 display: flex;
 flex-wrap: wrap;
 margin: 0;
 padding: 15px;
 
 
}
.tag-link {
  display: block;
  padding: 5px;
  padding-left: 10px;
  padding-right: 10px;
  
}
.tag {
  margin: 5px
}
15

да в примере не очень очевидно, я все думал, что мне не хватает параметра ширины. но как оказалось, что все нормально.

16

image
image1291×890 68.4 KB

Раздел про Флексы, почему все гридами делают? В задании про гриды ни слова, кроме как колонки и 1fr.
Что за баги в тренажёре, совпадение 100%?

17

Согласна, образцы разные, при наложении совсем другая картинка выходит. Пришлось искать ответ, тк визуально совпадает, а всего 88% показывает.