Transparent bild på bild
5 svar · 249 visningar · startad av J.N.
Är det såhär du menar?
.minbild1 {
position: absolute;
width: 200px;
height: 200px;
top: 100px;
left: 300px;
z-index: 2;
}
.minbild2 {
position: absolute;
width: 200px;
height: 200px;
top: 100px;
left: 300px;
z-index: 3;
}
...
<div class="minbild1"><img src="minbild1" width="200" height="200"></div>
<div class="minbild2"><img src="minbild2" width="200" height="200"></div>
Eller något annat sätt?
HEJ!
Nja, nästan, jag vill ha samma class för alla bilder, därför måste de positioner som finns vara med underbilden som utgångspunkt.
Fixar 'Relative' det i motsats till 'Absolut'? Har alltid endast använt 'Absolut'.
HEJ!
Nej, det fungerade inte, som jag trodde, ändrade till 'relative' istället, men hur får jag den andra bilden över???
.frame {
position: relative;
width: 125px;
height: 120px;
top: 0px;
left: 0px;
z-index: 3;
//skulle behöva en img src här!
}
Du kan göra en div som du placerar enligt relative, sedan skapar du en ny i den så att säga och denna placerar du sedan absolute. Jag vet inte hur tillåtet det är men det har funkat för mig i IE i alla fall.
.minbild1 {
position: relative;
width: 200px;
height: 200px;
z-index: 2;
}
.minbild2 {
position: absolute;
width: 200px;
height: 200px;
top: 0px;
left: 0px;
z-index: 3;
}
...
<div class="minbild1"><img src="minbild1" width="200" height="200"><div class="minbild2"><img src="minbild2" width="200" height="200"></div></div>
Ungefär något i den stilen... Kanske?
HEJ!
Tack för hjälpen, så här blev det:
.minbild1 {
position: relative;
width: 125px;
height: 120px;
z-index: 2;
}
.minbild2 {
position: absolute;
width: 125px;
height: 120px;
top: 0px;
left: 0px;
z-index: 3;
}
<div class="minbild1"><img src="/graphics/gepard.jpg" width="125" height="120"><div
class="minbild2"><img src="/graphics/frame.gif" width="125" height="120"></div></div>