Having some trouble creating an HTML form, particularly with resizing the Fieldset and legend elements. As a novice programmer, I am practicing building HTML forms. My goal is to have the form adjust its size based on the window without displacing the content. Unfortunately, my current code results in misaligned input fields and checkboxes when the window is resized. Any assistance would be greatly appreciated.
The HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" type="text/css" href="bestell.css">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<fieldset class="fieldset">
<legend id="one">
<img src="http://www.myhomematic.de/images/manufacturers/mediola-
logo-trans.png" class="image">
</legend>
<h1>Bestellantrag</h1>
<p>(für Investitionsgüter über € 400)</p>
<label for="antragssteller" class="">Antragssteller:</label>
<input type="text" value="" class="imput">
<!--<p>Name</p>-->
<label for="abteilung" class="abteilung_space">Abteilung:</label>
<input type="checkbox" class="begin1"> R&D
<input type="checkbox" class="begin1"> Marketing<br>
<input type="checkbox" class="begin21"> Operation
<input type="checkbox" class="begin22"> Vertrieb<br>
<input type="checkbox" class="begin3"> Admin
</fieldset><br><br>
<div>
<label for="Anschaffungswert">Anschaffungswert:</label>
<input type="text" value="" class="none">
<label for="Zeitpunkt" class="even">Zeitpunkt:</label>
<input type="text" value="" class="none"><br><br><br>
</div>
... (continued)
Please disregard the specific class names as they were chosen for styling purposes. Any tips on improving as a programmer would be highly valued.
The Styling
(CSS styles will go here)
...
https://i.stack.imgur.com/RLM54.jpg
UPDATE:
To help illustrate the issue, here is a link to a jsfiddle: https://jsfiddle.net/jsallans/ok2qf1jo/