I am comparatively new to HTML and CSS. I am making an attempt to construct a easy kind on the internet. I’ve positioned my radio packing containers side-by-side by hardcoding its location within the CSS. I’m questioning if there’s a greater of doing this quite than hardcoding it?

   <div class="div2">    
                            <p>Total End result:</p>
                            <enter kind="radio"  title="Route" worth="north">
                            <label for="direction1">High quality!</label><br>
                                
                            <enter kind="radio"  title="Route" worth="south">
                            <label for="direction2">Wonderful!</label><br>
                                
                            <enter kind="radio"  title="Route" worth="east">
                            <label for="direction3">Good!</label><br>
                                
                            <enter kind="radio"  title="Route" worth="west">
                            <label for="direction4">Unsatisfactory</label>   
                            <br>
                            <enter kind="radio"  title="Route" worth="weast">
                            <label for="direction5">Require Enhancements</label>            
                    </div> 
                     
                    
                    
                    <div class="div3">      
                            <p>Danger Analysis :</p>
                            <enter kind="radio"  title="Route" worth="north">
                            <label for="direction1">Extreme</label><br>
                                
                            <enter kind="radio"  title="Route" worth="south">
                            <label for="direction2">Excessive</label><br>
                                
                            <enter kind="radio"  title="Route" worth="east">
                            <label for="direction3">Medium</label><br>
                                
                            <enter kind="radio"  title="Route" worth="west">
                            <label for="direction4">Low</label>   
                            <br>
                            <enter kind="radio"  title="Route" worth="weast">
                            <label for="direction5">Insignificant</label>            
                    </div>

CSS

  .div2{
      border-radius: 1px;
      border-style: dashed;
      border-color: gray;
      background-color: white;
      padding: 10px;
      width: 300px;
    }
    .div3{
      border-radius: 1px;
      border-style: dashed;
      border-color: gray;
      background-color: white;
      padding: 10px;
      width: 300px;
      place:relative;
      left: 320px;
      backside:184px;
    }

enter image description here

1