Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Responsive multipage space tourism website

#accessibility
Olesia Kissaā€¢ 110

@olesiakissa

Desktop design screenshot for the Space tourism multi-page website coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


I would like to know, if there is a good way to make borders that appear below images at crew page stretch horizontally according to the design files? I was trying to put picture elements inside div container and play with the respective max-width and align-self properties but that didn't seem to work and images just get a huge gap between themselves and the border. I would also really appreciate any feedback regarding sizing because initially I was following a tutorial and then I had to readjust a lot of paddings and margins.

Community feedback

P
Emmilie Estabilloā€¢ 5,540

@emestabillo

Posted

Hi @olesiakissa , congrats on completing this project! I would try using a pseudoelement to have that line that spans from left to right under the crew images.

Some other points:

  • The nav logo should be wrapped in an a tag

  • I would increase the breakpoint because image and text side by side at 50em looks a little tight

  • Some of the hover effects could use a smoother transition

  • Assuming this is a portfolio project, I would also check it on other browsers. In Safari for example, the burger button needs a height property. And backdrop-filter doesn't work well.

Hope this helps! :-)

Marked as helpful

1

Olesia Kissaā€¢ 110

@olesiakissa

Posted

@emestabillo Thank you so much for your suggestions and for taking the time to check this whole project out! I would consider testing it in other browsers.

1

Please log in to post a comment

Log in with GitHub
Discord logo

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