• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Bild automatisch skalieren.

sir.sir

Neues Mitglied
Hallo,
bin ein totaler Anfänger und bekomme es einfach nicht hin, ein Bild abhängig von
der Größe des Fensters zu skalieren.
Das Ganze soll ohne Javascript funktionieren.
Zudem möchte ich einen Text im Zentrum des Bildes anzeigen.
Das Attribut "text-align:center" positioniert leider nur den Text horizontal mittig.

HTML:
        <div style='position:relative; height:60px'>
            <img  src='SendMailButton.png' width:100%; position:absolute; left:0px; top:0px' />
            <div style='position:absolute; height:60px; width:100%; height:60px; display:table-cell; vertical-align:middle'>
                <p style='position:relative; text-align:center'>hallo</p>
            </div>
        </div>
Kann mir vielleicht Jemand sagen, was ich falsch mache?
Danke im Voraus.
 
In deinem Code ist ein Fehler enthalten, denn das fehlt:

Code:
<img  src='SendMailButton.png' [COLOR=Red]style='[/COLOR]width:100%; position:absolute; left:0px; top:0px' />

Lösung unabhängig von diesem Problem: setz das img-Tag direkt unterhalb von <body> ein und gib html und body noch "height: 100%;".
 
Funktioniert leider auch nicht.
Wie kann ich einem Container mitteilen, dass das Bild, welches mit
"background:url(img/testimg.png)"
gesetzt wurde, sich der Größe anpasst?
 
Zurück
Oben