div-Element positionieren

[globe]

n'abend,

ich habe ein Problem mit div-Elementen ! Ich habe 3 Auswahllisten auf einem Bild positioniert. Unter diesem Bild habe ich zwei Buttons eingefügt. Jedoch werden die Button hinter dem Bild und nicht drunter angezeigt !
Ich hoffe Ihr könnt mir helfen !

position:absolute nimmt das Objekt aus dem (normalen) Dokumentenfluss heraus. Du kannst dieses Objekt zwar positionieren wo auch immer du möchtest, jedoch wird der Platz, den das Objekt normalerweise im Dokument verbraucht hätte dabei freigegeben. Deshalb verschinden deine Buttons (welche sich noch im Dokumentenfluss befinden) quasi hinter dem Bild, da das Bild an einer bestimmten Position einfach über das Dokument gelegt wird. Du musst also dafür sorgen, dass der Platz, den das absolut positionierte Bild verbrauchen würde, auch irgendwie freigehalten wird. In deinem Fall sehe ich aber keinen Grund das Bild zu positionieren.

<p><font size"+2"><u><b>7. Beschriften Sie die Gitarre vollständig !</b></u><br>

Das sieht mir schwer nach einer Überschrift aus. Die Schriftgröße, den Unterstrich und die Fettschrift kannst du mittels CSS spezifizieren. Das CSS Kapitel solltest du dir dringend mal durchlesen...

<div style="position:absolute;">

Wenn du das Objekt nicht positionieren willst, sondern ermöglichen, dass die Positionierung der Kindelemente relativ zum Objekt passieren kann, solltest du position:relative benutzen.

<img src="gitarre.jpg" title="gitarre" style="position:absolute; width:600; height:399,25;">

Du spezifizierst eine Breite von 600. 600 was? 600 Bananen? Vermutlich sprichst du von 600 Pixel: width:600px. Du gibst eine Höhe von "399,25" an. Zum Einen fehlt hier das "px", zum Anderen ist das Komma hier kein valides Dezimaltrennzeichen. Die Computerwelt sieht grundsätzlich den . (Punkt) als Dezimaltrenner an: height:399.25px. <Mutmaßung>Die Angabe des viertel Pixels ist auch fragwürdig, da dieser Wert ohnehin gerundet wird.</Mutmaßung>

<div style="position:absolute; top:55px; left:60px;">
<select name="Gitarre4" size="1" style="width:75px;">

Warum steckst du <select> in ein <div>? Du kannst auch das <select> direkt positionieren.

<br>
<br>
<br>

Zeilenumbrüche sind uncool.
Nutze <p> und gib einen Abstand an.

<p><div align="center"><input type="button" onclick="abfrage()" name="Pr&uuml;fen" value="Pr&uuml;fen" style="cursor:pointer;">

Du könntest den <p>aragraph auch (ab)schließen, bevor du einen neuen öffnest.

Du möchtest lernen wie man HTML einsetzt (valide, nur Struktur) und wie man CSS richtig einsetzt (zentrales CSS-Dokument, keine style-Attribute im HTML). Du wirst dich nach der Lernphase wesentlich leichter tun.

weiterhin schönen abend...