Button und Textbox auf selber Höhe
Hallo, ich hab das Problem, dass bei mir der Button versetzt zur Textbox angezeigt wird. Wie kann ich dies beheben?
Der hier verwendete Code
<style>
#records{
margin-top: 123px;
background-color: aquamarine;
font-size: 30px;
}
#textbox_top{
border-style: solid;
border-color: olive;
border-width: 2px;
font-size:30px;
border-radius: 20px;
padding-left: 20px;
padding-right: 20px;
width:70%;
}
.radio_button_top{
}
#whole_area_top{
}
#button_area{
border-radius: 20px;
background-color: red;
border-width: 2px;
border-color: blue;
color: white;
height:45px;
width: 20%;
}
#button_area:hover{
background-color: green;
}
#textbox_top::-webkit-input-placeholder { /* WebKit, Blink, Edge */
color: #CCCCCC;
font-family: 'Grand Hotel';
font-size: 30px;
font-weight: bold;
}
#textbox_top:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #CCCCCC;
opacity: 1;
font-family:'Grand Hotel';
font-size: 30px;
font-weight: bold;
}
#textbox_top::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #CCCCCC;
opacity: 1;
font-family: 'Grand Hotel';
font-size: 30px;
font-weight: bold;
}
#textbox_top:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: #CCCCCC;
font-family: 'Grand Hotel';
font-size: 30px;
font-weight: bold;
}
#textbox_top::-ms-input-placeholder { /* Microsoft Edge */
color: #CCCCCC;
font-family: 'Grand Hotel';
font-size: 30px;
font-weight: bold;
}
#textbox_top::placeholder { /* Most modern browsers support this now. */
color: #CCCCCC;
font-family: 'Grand Hotel';
font-size: 30px;
font-weight: bold;
}
label {
font-size: 20px;
}
#helfer{
display:flex;
}
</style>
<body>
<form action="teststart.php" method="POST">
<div id="helfer">
<input type="text" id="textbox_top" name="textbox_top_php" placeholder=" Ihre Eingabe">
<button id="button_area" type="submit" >Das ist ein Button</button>
</div>
<label for="radio_button_top">
<input type="radio" id="titel_radio_button" class="radio_button_top" checked onclick="titel_radio_button_clicked()" name="titel_radio_button_php" value="Titel">Titel
</label>
<input type="radio" id="autor_radio_button" class="radio_button_top" onclick="autor_radio_button_clicked()" name="autor_radio_button_php" value="Autor">Autor
</form>
</body>
</html>