hallo,
ich übe zur zeit ein wenig css. soweit so gut.
nun habe ich mit div-boxen ziemliche probleme, wenn ich dort bilder einfügen will.
aktuelles beispiel:
ich habe eine div box exakt positioniert mit diesen werten:
.box1 {
background:silver;
border:1px solid black;
margin:1px;
padding:0px;
height:150px;
width:150px;
}
nun mache ich ein div-tag auf und füge mit IMG SRC (ohne weitere parameter) ein bild ein, das ebenfalls EXAKT 150x150 ist.
ziel ist, dass das bild die box komplett ausfüllt, somit exakt positioniert ist und auch noch den schwarzen rahmen der box trägt.
aber das klappt nicht. ständig habe ich eine verschiebung. also das bild scheint nach oben verschoben und ich habe unten ca. 1mm platz zwischen bild und unterem box-rand, obwohl halt box und bild exakt 150x150 pixel breit/hoch sind.
wo kommt das??? ich versteh das nicht.
p.s. wie postet man hier vernünftig html quellcode?
danke
Homepage selbermachen 7.851 Themen, 35.616 Beiträge
unten ca. 1mm platz zwischen bild und unterem box-rand
Dann hast Du vermutlich Whitespaces zwischen dem IMG-Tag und dem Start und End-Tag des DIVs. Da die als Text interpretiert werden wird das Bild dann wie im Fließtext angezeigt, d.h. das Bild wird auf Höhe der Basisline des Textes positioniert, der Platz unter des Basislinie des Tewird natürlich für reserviert für Zeichen die unterhalb der Basisline weitergehen wie z.B. das kleine "g"...
Mit
<div class="box1"><img src="..." height="150" width="150"></diV>
sollte dieses Problem nicht auftreten...
wie postet man hier vernünftig html quellcode?
Ganz einfach < für < und > für > verwenden, so wie man das immer macht wenn man HTML-Code auf HTML-Seiten darstellen möchte ;-)
Gruß
Borlander
Dann hast Du vermutlich Whitespaces zwischen dem IMG-Tag und dem Start und End-Tag des DIVs. Da die als Text interpretiert werden wird das Bild dann wie im Fließtext angezeigt, d.h. das Bild wird auf Höhe der Basisline des Textes positioniert, der Platz unter des Basislinie des Tewird natürlich für reserviert für Zeichen die unterhalb der Basisline weitergehen wie z.B. das kleine "g"...
Mit
<div class="box1"><img src="..." height="150" width="150"></diV>
sollte dieses Problem nicht auftreten...
wie postet man hier vernünftig html quellcode?
Ganz einfach < für < und > für > verwenden, so wie man das immer macht wenn man HTML-Code auf HTML-Seiten darstellen möchte ;-)
Gruß
Borlander