Hi, I notice the icon element doesn’t respond to
text-align: center;
In the element Style field.
So what am I supposed to do?
Thanks
Hi there!
The reason it is does not appear to be working is because the icon is an inline element and the alignment is based on the width of the element, rather than it’s parent container. It’s actually center aligned by default, but because the width s based on the size of the icon, rather than the parent container, it appears left aligned.
That being said, all you need to do to center the icon is to change the width of the icon element instead, to fill the parent container, by adding this to the style field instead:
width: 100%;
Once you’ve done that, you’ll notice that the icon now has more room to play in, you could add left or right alignment as you were before, and that would now affect the icon.
Hope this helps!