Solved: HTML buttons side by side

I have created a audio play page and need to display two buttons side by side in HTML. I am using the inline-block display and the buttons are still not appearing side by side

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>

    <style>
        button {
            display: inline-block;
            margin: 5px; /* space between buttons */
            background: #b06f97; /* background color */
            color: #333; /* text color */
            font-size: 1.5em;
            font-family: ‘Georgia’, serif;
            font-style: italic;
            border-radius: 50px; /* rounded corners */
            padding: 8px 16px; /* space around text */
            -moz-transition: all 0.2s;
            -webkit-transition: all 0.2s;
            transition: all 0.2s;
            float:unset;
        }
    </style>
    <button onclick="setPlaySpeed()" type="button">1.5x Speed</button><br>  <button onclick="setPlaySpeed3()" type="button">1x Speed</button><br>

    <video id="myVideo" width="320" height="176" controls>
        <source src="audio/audio/nextechfinal2.mp3" type="video/mp4">
        <source src="mov_bbb.ogg" type="video/ogg">
        Your browser does not support HTML5 video.
    </video>




    <script>
        var vid = document.getElementById("myVideo");

        function getPlaySpeed() {
            alert(vid.playbackRate);
        }

        function setPlaySpeed() {
            vid.playbackRate = 1.5;
        }

        function setPlaySpeed3() {
            vid.playbackRate = 1;
        }


    </script>

Open in new window