HTML / CSS Anfänger: Suchformular - Mein fertiges Ergebnis

Beitrag lesen

Hallo,

vor allem hast du immer noch zahlreiche unnötige div-Elemente drin. Zwei davon, nämlich div.div_oben und div.btn_suche, sind nicht komplett unsinnig, aber anstatt div wäre hier eher fieldset angebracht (das hat schon jemand anders vorgeschlagen), das eigentlich zur Gruppierung von Formularelementen gedacht ist.

Die anderen drei div-Elemente sind aber komplett überflüssig, denn sie "gruppieren" nur jeweils ein einziges Element. Die Formatierungen könntest du ebensogut direkt auf die select-Elemente anwenden, dafür braucht's keinen div-Container drumherum. Das würde den Code nochmal kompakter und übersichtlicher machen.

hab es nochmals etwas überarbeitet, was sagst du dazu?

section{
width: 500px;
margin: 0 auto;
}

.form_suche {
width: 100%;
margin-top: 3em;
padding: 1em;
box-sizing: border-box;
text-align: center;
}

fieldset {
background-color: #efefef;
padding: 1em;
width: 100%;
border: none;
}

select {
display: inline-block;
width: 30%;
}

.btn_suche {
width: 50%;
background-color: #efefef;
padding-bottom: 10px;
margin: 0 auto;
}
<section>
  <form name="form1" method="post" action="" class="form_suche">	
    <fieldset>		
		<select></select>
	 	<select></select>
	    <select></select>
	</fieldset>
	<div class="btn_suche">
		 <button type="submit">Suchen</button>
	</div>		        
    </form>
</section>