Not able to move the button to the right of the page and the text to the center of the page

Issue

Not able to move the button to the right of the page and the text to the center of the page even though I have added the necessary CSS ( float right etc.,)

<div id="project-heading"  style = "margin-top: 0px; padding-bottom: 0px;margin-bottom: 0px ; padding-top: 5px" text-align="center">
    <span display="inline;" float = "center;" style="color: white;">Visual Analysis of US Accidents Data  </span>
    <button position = "absolute;" background-color ="black;" color = "white;"  float ="right;" display="inline-block;" padding-left = "100%;"  id="reset" onclick="reset">Reset
    </button>
</div>

Solution

display, float, etc.
are all CSS variables that should be included in the style="" part of the HTML, not as keyword parameters. I have demonstrated the correct way to insert them in the snippet below. You can also use right: 0 to align an element to the right side of its parent. It is often more reliable than float. I used right: 10px in this example so the button had a bit of breathing room on its right side.

<h1>Only fixed syntax:</h1>
<div id="project-heading"  style = "background: blue;margin-top: 0px; padding-bottom: 0px;margin-bottom: 0px ; padding-top: 5px; text-align: center;">
  <span style = "display: inline; float : center; color: white;">
    Visual Analysis of US Accidents Data               
  </span> 
  <button style="position: absolute; color: white; background-color: black; float: right; display: inline-block; padding-left: 100%" id="reset" onclick="reset">
    Reset
  </button>
</div>    

<h1>Fully fixed version</h1>
<div id="project-heading"  style = "background: blue;margin-top: 0px; padding-bottom: 0px;margin-bottom: 0px ; padding-top: 5px">
  <span style = "display: inline; float : center; color: white;">
    Visual Analysis of US Accidents Data               
  </span> 
  <button style="position: absolute; background-color: black; color: white; float: right; display: inline-block; right: 10px" id="reset" onclick="reset">
     Reset
  </button>
</div>

Answered By - Sam Spade