Test Your Skills: Fundamental layout comprehension
Starting point files from MDN: index.html - styles.css if you need.
Final live example: index.html
Final CSS from me: styles.css
Online editor: click here
For this test skill I did a bit more than what the assessment wants. I’ve created three layout for mobile, tablet and desktop (if the breakpoints are appropriate, I’m not sure!). And to implement layout for each component (navigation, sidebar and main layout ) I used grid or flexbox and also float as fallback. I know code is a bit lengthy but I’ve documented the CSS with comments. Please read my CSS and say how it is?
- Should I use float too?
- Are breakpoints appropriate?
- And I’ve got a question in CSS line number 100.
- And another question in CSS line number 145.