How to place text between two `<i>` in HTML?

Question

So the title is not the best but I'm actually trying to modify the font-size of this text:

<i class="fa fa-line-chart" aria-hidden="true"></i>Containers graphics<i class="fa fa-line-chart" aria-hidden="true"></i>

I have tried to put <p> Containers graphics </p> but then the icons where one upside and one downside the text...

Thank you for your help and ideas

Answer 1

只需将<span放上font-size

 <i class="fa fa-line-chart" aria-hidden="true"></i><span style="font-size:20px">Containers graphics</span><i class="fa fa-line-chart" aria-hidden="true"></i> 

Answer 2

Just add display:inline to the css.

like that:

.fa{display:inline;} a{display:inline;}

Of course you better add classes specific to those elements so it wont effect every .fa and every a element.

Answer 3

Try this css

 .container { font-size: 20px; } .container i { font-size: 30px; } 

 <div class="container"> <i class="fa fa-line-chart" aria-hidden="true">Ico</i>Containers graphics<i class="fa fa-line-chart" aria-hidden="true">Ico</i> </div>