Product Landing Page - Build a Product Landing Page

How can i fix the header cause it did not take up the space in the right side. How can i also make the nav be in the rightest side of the header?

How can i also make the icons bigger and fix the first child of the second container (Features) because its uneven to the second and third ?

My code so far

Challenge: Product Landing Page - Build a Product Landing Page

Link to the challenge:

Hello there. Nice work on the landing page! :star:

For the navbar, I’d say try giving it a width that makes it span to the end. And to make the nav span to the end of the page, you would need to switch up your justify-content style to something else. You used space-around as I can see. Did you try other styles like space-evenly or space-between? I’ll let you experiment with the different styles and see what it gives :wink:

When it comes to sizing icons, I see that you have used the Font Awesome library. You can take a look at the docs here to have an idea of how sizing works. Be careful though. You have a fa 3x in your icon class that might conflict when you add a size.

To make all the children of the second container be aligned, you need to apply equal padding to their wrapping parent. For example,

<div class="second container ">
     <div class="grid"></div>
     <div class="grid"></div>
     <div class="grid"></div>
</div>

For every child inside second container to be aligned, they all need equal distance from the surrounding parent. So, to the wrapping div, try applying some padding that will affect all the children.

I hope this breakdown helps you with the challenge. Feel free to ask any more questions ifyou are stuck.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.