Room homepage responsive using HTML, CSS & jQuery
Design comparison
Community feedback
- @grace-snowPosted about 4 years ago
In your js, I'd recommend you use classes to show/hide things rather than setting style properties. Then you would be able to have really nice transitions for interactive elements, like menu sliding into view etc.
And tbh, with stuff like this you really don't need jquery. It would be better for learning if you practice your vanilla js 😉
0 - @grace-snowPosted about 4 years ago
Looking at the html, I notice a few bits that aren't accessible at the moment.
- place images inside buttons if they are acting like them (with an accessible label)
- make sure your alt text, if present, is meaningful and accurately describes the image, otherwise leave blank
- your menu should probably be a list of links and have appropriate aria labels to explain state and associate the menu button to the menu items
0 - @leonelmequePosted about 4 years ago
Hi, I think you have to review you css code for responsiveness, when I open the app it starts with the content all in column instead of a slide look and feel.
body{ margin: 0; overflow-x: hidden; font-family: 'Spartan'; // This should be 'Spartan', san-serif; }
It's also a best practice if you add this piece of code in to your css
*{ padding:0; margin: 0; border:0; outline: 0; }
This will help you remove any unwanted padding or margin values that come with html by default.
0@PhantomOzPosted about 4 years ago@leonelmeque please what screen size cause I tested and it is responsive at my end
0
Please log in to post a comment
Log in with GitHubJoin 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