How do I align text horizontally with other text?

I am writing some html code, and would like to know how to align some text so that the text has the same indent as other text from the left of the page.

Here is my code:

<p><i class="fa fa-phone"></i><span style=""> Phone : 0800 000 000</span></p>
<p><i class="fa fa-home"></i><span style=""> Web : http://www.example.com</span></p>
<p><i class="fa fa-map-marker"></i><span style=""> Map : example map address</span></p>
<p><i class="fa fa-envelope"></i><span style=""> Email : example@address.com</span></p>

In the above code, some of the icons have a different width than the other icons. Because of this, the text for the lines of code do not align the same distance from the left of the page.

How can I do this? Am I looking for the span class or something else?

Thanks in advance.


Source: css

Leave a Reply