Bild verkleinern
René
- css
Hi,
wie kann ich ein Bild mit CSS so verkleinern das es ohne das man scrollen muss auf den Bildschirm passt?
Bei Höhe=100% und Breite=100% wird bei mir die Höhen-Angabe ignoriert!
Was mache ich falsch?
Gruß,
René
Noch schnell ein Beispiel
Hallo,
wenn Du strict kodierst, darf <img> nicht direkt im <body> stehen, aber das war hier nicht das Problem.
Auf was beziehen sich die 100% denn? Die Elternelemente haben keine definierte Größe. Wenn Du <html> und <body> ebenfalls auf 100% setzt (und das in strict erforderliche wrapper-Element (hier das <div>) um das <img> ebenfalls), dann klappt es:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Zu hoch!</title>
<style type="text/css">
html, body { border:0; margin:0; padding:0; height:100%; width:100%; }
div, img { height:100%; width:100%; border:0; margin:0; padding:0; }
img { display:block; }
</style>
</head>
<body>
<div>
<img src="b.png" alt="gibbet ned" />
</div>
</body>
In IE6, Opera 9.01 und Firefox 2 stimmt es so.
Shepard
Hi,
wenn Du strict kodierst, darf <img> nicht direkt im <body> stehen, aber das war hier nicht das Problem.
Stimmt mir geht es um das Problem in einem andern Zusammenhang, aber damit kann man es ab leichtesten verdeutlichen.
Auf was beziehen sich die 100% denn? Die Elternelemente haben keine definierte Größe. Wenn Du <html> und <body> ebenfalls auf 100% setzt (und das in strict erforderliche wrapper-Element (hier das <div>) um das <img> ebenfalls), dann klappt es:
[...]
In IE6, Opera 9.01 und Firefox 2 stimmt es so.
So wie du meine Frage verstanden hast stimmt es.
Ich will aber das dabei auf jeden Fall das Seitenverhälltnis erhaltenbleibt!
Ich habe jetzt width mit max-width ersetzt und es sieht so aus wie ich es mir wünsche.
Danke das du mich weiter gebracht hast!
PS: In deinem Schnipsel fehlte das </html> SCNR
PS: In deinem Schnipsel fehlte das </html> SCNR
ich wollte mich halt auf das Wesentliche konzentrieren:-)