Best way to get icons and text aligned? Product Landing Page

HTML-CSS
1

I’m working on the product landing page for the HTML-CSS course. I’d like my icons and text neatly aligned like in the example landing page, but this is what I’m getting

image
image2578×544 85.2 KB

Ideas?

Codepen: https://codepen.io/justinceo/pen/NWgbyMZ

2

The culprit is the justify-content: center on the container. Remove that and they will line up the way I think you want them to. But now they are all the way over to the left, so you need to center the container. One way to do that would be to give it a max-width (preferably in rem units) and then center it with auto side margins.

1 Like
3

Please I don’t understand can u explain further or send me a video please

4

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