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

space tourism site solution with react.

#accessibility#react#react-router

@naser23

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


This is the first project that i will use for my portfolio so i want to make sure it looks as good as it can be. what do you think I can do to improve upon this project?

Community feedback

P

@developedbygeo

Posted

Looking clean! If you are open to suggestions, I would recommend the following:

  • The landing page button could direct to the next page.
  • Crew and destination pages tend to 'jump' a little bit when changing the active selection. You could solve this by adding height: 100% to the destination-info-container.
  • If you change pages, between Crew, Destination and Technology, you see the content is jumping around. Maybe you could set specific container dimensions so that it appears more uniform.
1

@naser23

Posted

@developedbygeo thank you for the feedback Georgios!!!

For the 'jumping' on each page, I will try to set the height to 100%. I used to set a height on each container in order to set them how I wanted to but I heard that its better to let the content determine what the height will be. I guess sometimes its good to set a specific width and height.

1
P

@developedbygeo

Posted

@naser23 I do agree that letting CSS infer the actual dimensions is a good practice, but usually that can lead to 'jumping' if there is a deviation in terms of the text's length.

Another thing that you could try, would be to set the min-height.

Looking forward to seeing your next project!

0

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