JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" type="text/css" href="style.css">
    <meta charset="utf-8">
    <title>Mc-bergbys</title>
    <script src="script.js"></script>
  </head>

  <body>
    <h1>Velkommen til Mc-bergbys</h1><br>
    <h3>Velkommen til menyvelgeren</h3><br>
    <h4>Sett sammen din meny under</h4><br>
    <input type="text" id="input" placeholder="Navn??"><br>
    <div id="drikke">
      <input type="radio" name="drikke" value="25" id="cola">Cola<br>
      <input type="radio" name="drikke" value="25" id="solo">Solo<br>
      <input type="radio" name="drikke" value="25" id="sitron">Sitronbrus<br>
      <input type="radio" name="drikke" value="0" id="vann">Vann<br>
    </div>
    <div id="mat">
      <input type="radio" name="mat" value="30" id="hamburger">Hamburger<br>
      <input type="radio" name="mat" value="40" id="kylling">Kylling<br>
      <input type="radio" name="mat" value="40" id="cheeseburger">Cheeseburger<br>
      <input type="radio" name="mat" value="30" id="nuggets">Nuggets<br>
    </div>
    <div id="tilbehør">
      <input type="radio" name="tilbehør" value="15" id="pommes">Pommes Frites<br>
      <input type="radio" name="tilbehør" value="20" id="løkringer">Løkringer<br>
      <input type="radio" name="tilbehør" value="20" id="cheesesticks">Cheesesticks<br>
      <br>
    </div>
    <div id="dip">
      <input type="checkbox" name="dip" value="5" id="ketchup">Ketchup<br>
      <input type="checkbox" name="dip" value="5" id="sennep">Sennep<br>
      <input type="checkbox" name="dip" value="5" id="grillkrydder">Grillkrydder<br>
      <input type="checkbox" name="dip" value="5" id="dip">Dip<br>
    </div>
    <div id="resultat">
      <br><br>
      <button id="sendinn" onclick="regnut()">Regn ut</button>
      <input type="text" placeholder="totalpris" readonly="true" id="output">
    </div>
    <script>
      function regnut() {

        var drikke =...

CSS

@import url('https://rsms.me/inter/inter-ui.css');
html {
  height: 100%;
}

body {
  background-image: linear-gradient(45deg, #ff9a9e 0%, #fad0c4 99%, #fad0c4 100%);
  font-family: 'Inter UI', sans-serif;
}

#drikke,
#mat,
#tilbehør,
#dip {
  float: left;
}

#resultat {
  display: inline;
}

input {
  margin: 4px;
}

#fresh {
  font-family: 'Inter UI', sans-serif;
  float: right;
}