@kabir-afk
Posted
Hey good job on completing the challenge , in terms of responsiveness, it is ok , but there are still some issues that I'd like to address . . .
Regarding Icons
As this was an intermediate challenge , which had to be done using only HTML and CSS, the icons had to made that way as well . . . 😅😅
Regarding paragraph and gap issue
I'm not exactly sure of the gap issue you are mentioning , if you'll elaborate then I might be able to help further, but I noticed that your p-container needs a line-height as well as , you need to increase it's width for a more accurate design . . good job otherwise!! 👍👍
Marked as helpful
@lrobb95
Posted
Greetings, @kabir-afk!
Thank you very much for those suggestions! I see what you’re talking about with the line spacing and I cannot believe I missed that detail! I am going to get on that right now.
The gap issue that I believe I am facing is regarding the spacing between the “phone” and the paragraph text. It seems to be way too spread out from each other on the desktop View in my opinion. As far as when comparing it to the design anyway.
@kabir-afk
Posted
@lrobb95 hey, I found what was causing the mishap . .
.content-container {
display: grid;
place-items: center; <---basically this right here
grid-template-columns: 1fr 1fr;
/* gap: 4rem; */
width: 90%;
height: 100%;
}
By using grid and place-items:center;, you were not able to override it with anything else . . .
In order to avoid this issue , you can use justify-self and align-self in individual columns, rather than controlling all items positioning through the parent element . . . hope you find this to be helpful 🥂🥂
Marked as helpful
@lrobb95
Posted
@kabir-afk thank you very much for helping me on that, I’ll give it a go! :D
@kabir-afk
Posted
@lrobb95 My pleasure!!! 🥂🥂
