zadanie domowe bez zadania 5#152
Conversation
devmentor-pl
left a comment
devmentor-pl
left a comment
There was a problem hiding this comment.
Dagmaro,
Skomentowałem parę rzeczy :)
Wszystko jaśnię na spotkaniu!
| border-bottom-color: transparent; | ||
| } No newline at end of file | ||
| shape-outside: polygon(0 0, 0 100%, 100% 0); | ||
| margin-right: 20px; |
| .b { | ||
| grid-column: 2 / 3; | ||
| grid-row: 2 / 3; | ||
| } |
| <source srcset="small.jpg" media="(max-width: 599px)"> | ||
| <source srcset="medium.jpg" media="(min-width: 600px)"> | ||
| <source srcset="large.jpg" media="(min-width: 1200px)"> | ||
| <img src="default.jpg" alt="Sample Image"> |
There was a problem hiding this comment.
Brakuje mi tych obrazków na GitHubie ;P
There was a problem hiding this comment.
Ten plik nie jest podpięty pod plik HTML :P
| <header class="p">P</header> | ||
| <side class="v">V</side> | ||
|
|
||
| <body> |
There was a problem hiding this comment.
Tutaj mamy 2x body - myślę, że przez pomyłkę zostawiłaś niepotrzebnie to co jest powyżej wraz z body.
| .p { | ||
| grid-row: 1 / 2; | ||
| } | ||
|
|
||
| .t { | ||
| grid-row: 2 / 3; | ||
| } | ||
|
|
||
| .v { | ||
| grid-row: 3 / 4; | ||
| } |
There was a problem hiding this comment.
Przypuszczam, że starałaś się tutaj rozwiązać problem z 2x body - pamiętaj, że grid-row określa ile wierszy ma zajmować ten element. W naszym przypadku w zasadzie ma sie dostosować do wolnej przestrzeni więc auto lub po prostu nic nie pisać.
| <a href="#">kontakt</a> | ||
| </li> | ||
| <li><a href="#">SETTINGS</a></li> | ||
| <li><a href="#">CONTACT</a></li> |
| .menu li { | ||
| position: relative; | ||
| } | ||
|
|
||
| .menu a { | ||
| display: block; | ||
| padding: 15px 20px; | ||
| text-decoration: none; | ||
| color: #000; | ||
| } |
There was a problem hiding this comment.
Zdecydowanie łatwiej jest stylować po klasach. Pamiętaj, ze ten zapis tj. .menu a oznacza, że wszystkie elementy a (linki wew. .menu) będą miały te cechy.
| <meta http-equiv="X-UA-Compatible" content="ie=edge"> | ||
| <title>devmentor.pl - HTML & CSS: RWD - #04</title> | ||
| <title>Responsive Menu</title> | ||
| <link rel="stylesheet" href="styles.css"> |
There was a problem hiding this comment.
Tutaj adres do pliku jest nieprawidłowy - powinno być styles/styles.css
|
|
||
| <nav> | ||
| <ul> | ||
| <div class="menu-toggle" id="menu-toggle">☰</div> |
There was a problem hiding this comment.
Na jakiej zasadzie chcesz zrobić przełączanie? :focus, :checked ?
devmentor-pl
left a comment
devmentor-pl
left a comment
There was a problem hiding this comment.
Dagmaro,
Zostawiłem jeszcze parę drobnych uwag, ale poza tym jest ok! 👍
| text text text text textext text text text text | ||
| text text text text text </p> | ||
|
|
||
| </article> |
There was a problem hiding this comment.
Za elementem article powinnaś zamknąć section, aby było zgodnie z "projektem". Każdy "wiersz" ma swoje zielone obramowanie.
| <article class="blue footer"> | ||
| <h1 class="yellow footer">logo</h1> |
There was a problem hiding this comment.
Brakuje zamknięcia dla article. Ten element powinien dodatkowo posiadać section, o klasie green, aby mieć swoją zieloną ramkę.
There was a problem hiding this comment.
Zwróć uwagę, że teraz jeden zielony jest zagnieżdżony w drugim:
|
|
||
| .menu .items li:last-child { | ||
| margin-right: 0; | ||
| } No newline at end of file |
| .yellow.footer { | ||
| width: 50%; | ||
| } | ||
|
|
2 participants
zadanie domowe bez zadania 5