Float <i> to the right of <div> in html-CodePudding

I want to align this <i> to the right side in my <div>. This is my html code:

<div >
     <h2>Heading</h2>
     <span >Welcome</span>
     <i  style="float: right;"></i>
</div>

The above code is not working. What can I do to fix this?

CodePudding user response：

Change HTML This Way

<link href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css" rel="stylesheet"/>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"/>
<div >
  <div >
    <h2>Heading</h2>
    <div>
      <span >Welcome</span>
    </div>
  </div>
  <div>
    <i ></i>
  </div>
</div>