verschachtelte div

[beatovich]

hallo

Hallo,

ich probiere jetzt schon seit Stunden ein verschachteltes div mit style aus

1. Ich möchte eine Grafik1 per absolute setzen
2. Danach kommen Texte und eine weitere Grafiken2-4 die relativ von der ersten Position der ersten Grafik1 abhängig sein sollen.

Google zeigt zwar verschachtelte div aber keine Kombination aus div und img

Hier mein Ansatz

Als erstes sollte bei dir Text und Bild in einer aus Sicht des Lesers logischen Abfolge stehen. Alle Bilder brauchen ein alt Attribut.

<div style="position:absolute; left:440px; top:360px;>

Hier fehlt ein schliessendes ["]

<img id="g1" src="gif/1pol/gen.gif" style="position:relative; left:0px; top:0px; height:70px; width:70px;">

hier fehlt das alt Attribut

<div style="left:20px; top:-61px; font-size:30pt; position:relative;">G <div class="schaltertext" style="left:-17px; top:5px; text-align:center; position:relative;">94

Du hast hier den logischen Text "G 94", den du grafisch zerreisst.

Manchmalreichen einfach auch span Elemente.

Da dein Schalter aber eventuell etwas tun soll, wäre wohl ein <button> angebracht.

<img class="schalter1pol" id="gst1" src="gif/1pol/stellungsanzeiger_ein_gruen.gif" style="left:-2px; top:-70px; position:relative;">

Hier fehlt das alt Attribut

<div class="schaltertext" style="left:-40px; top:-20px; text-align:center; position:relative;">Generator-<br>schalter </div></div></div></div>

Wo liegt hier der Fehler ? Sitze ich auf der Leitung ... ich sehe nichts, oder gibt es eine bessere Lösung ?

Drucke zuerst deinen Schalter durch ein logisches Element aus. Das wird wohl ein button sein. Beschrifte diesen Button logisch.

Dann kannst du ein grafisches Element verwenden. Dieses kann je nach Button Zustand auch ausgetauscht werden. Es kann via svg realisiert werden oder als background-image im CSS eigebunden.

aria-label ist in dem Fall dein Freund.