I am currently at the Product Landing Page challenge and there is a question I can’t find how to answer.
There is a gap between two div’s: one has an image in it and the second has text.
Now, I would like to know, how to make that gap disappear, to make the webpage look fluent, without gaps in it.
I tried with
margin: 0, but tha gap won’t go away.
It is between the HP INVENT Building picture and the text below it.
Here I give you the link on codepen:
Product Landing Page challenge pen
Any advice is helpful.
If you give
display: flex; to the div container it will fix the issue.
For example: give a class name to the div container like
hp-container then select it like:
I will use that, thank you. Now, I changed my mind from using
ul and just simply using
div's instead and mere text and icons.
div have their own importance for different cases. By the way, you can only set
display: flex; on the image with the latest code you wrote.
margin: 30px 0 0 0;
display: flex; /* add this line*/
Thanks for your contribution. Problem solved.
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.