Latest solutions
Latest comments
- @Tushar6396@AlexandruStefanGherhes
Hello @Tushar6396, congrats on finishing the challenge and you did a good job on it. To have your card center exactly in the middle of the screen try adding "height:100vh" to the body and remove the margin-top from the main container.
For the main container, you could add more padding-top to have a bit more space between the start and the border of the container. You could also increase the size of the buttons to 45 px, like that they would be a little closer together and look much better. For the button, try increasing the padding to 12px and the border radius to 25px with a font size of 16px, and see how it looks.
Good luck on your future challenges.
Marked as helpful - @vinci2fast@AlexandruStefanGherhes
Hello @vinci2fast, you did a really good job on this challenge, especially as your first FE project. For the icon in your button, if the icons provided in the resources don't work as they should, I would recommend getting them from font awesome, as they are almost identical.
- @polukarp@AlexandruStefanGherhes
The project look really good @polukarp, for the hover animation, normally we apply it on elements that are interactive, having it on "intro__form" looks good but does not have a utility. Having it on a button is normal since it's a call to action. Also adding a little more padding on the form would make it look more spacious. Are you going to take care of the JS part of the challenge as well?
- @usamariaz2@AlexandruStefanGherhes
Hello @usamariaz2, good job on completing this challenge. I would recommend taking on the challenge to also have the element responsive on mobile display as well. On the body element, try adding the property "height:100vh" to have your container centered exactly in the middle of the screen.
Outside of that you really did a great job.
Marked as helpful - @Mondiserh@AlexandruStefanGherhes
Hello @Mondiserh, congrats on finishing the challenge, but there are a few more things needed to polish this one. I see that you built the challenge on desktop first, which is not really an issue, but if you look at your mobile display the design is not responsive.
Your main container has a fixed height of 48 rem, which leaves you with the white border at the bottom of the display. I would recommend setting it to 100vh, and inside the main container create another div call container that holds the rest of your elements. For the button, you can remove the border to have a sharper look.
Marked as helpful - @SEIFSEIF4@AlexandruStefanGherhes
Hello @SEIFSEIF4, what i would recommend is that in the container div to have 2 divs instead of your current 3, the first one just for the 'community' part, and the second one to hold both the 'subscription' and 'why us' parts, like that it would be much easier to divide the space and solve your width issue.
Marked as helpful