Responsive multi page site, CSS, JS

Solution retrospective
Following with the great tutorials by Kevin Powell, now it was the turn to build this Space Tourism site. I followed his lessons on Scrimba (https://scrimba.com/learn/spacetravel) and after finished them there were a few issues to develop and fix.
· Technology page wireframe: Continuing with the grid system used on the other pages of the site, here we found a bit more complicated design as the tab list was vertical for desktop sizes and horizontal for tablets and mobile devices.
· Dynamic image in Technology page: There were a portrait and landscape version of the images to be displayed for every tab content so I played with the "display:block/style" to show the appropriate version.
· Destination page, Titan content: I do not remember if on the Powell's lessons that was fixed. Anyway, I detected that the content of this slide was not visible, the id of the content was "europa-tab" instead of "titan-tab".
And basically that's all. Not a very complicated exercise but very interesting especially using the grid system.
Please log in to post a comment
Log in with GitHubCommunity feedback
- @pedrognrd
I do not find documentation to fix this error detected in the HTML validation report
Message: Element "span" is missing one or more of the following attributes: "role". Code: "vigation"><span class="sr-only" aria-expanded="false">Menu</"
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord