4 svar · 259 visningar · startad av Biasse
När jag fixerar en bild ensam på en sida använder jag tex:
<div style="position:absolute;top:37%;left:48%;margin:-115px 0 0 -150px;">
min bild
</div>
Men hur gör jag när jag har en tabell men 1 rad och 3st kollumer och vill ha en bild på varje sida mitt på en sida i olika upplösningar? Måste på nått vis dela upp det annars blir det inte rätt.
Får inte till det med den första varianten.
Det här borde väl fungera:
<img style="position: absolute; left: 50%; top: 50%; margin: -bildhöjd/2 0px 0px -bildbredd/2; z-index: 50;" />
<table>
Och vad än den innehåller
</table>
För säkerhets skull ett z-index som kommer at ligga över tabellens så att bilden hamnar ovanpå den.
Då ska bilden placeras i mitten av sidan.
En variant..
[red]<html>
<head>
<style type="text/css">
#mycontent {
position:absolute;
top: 50%;
left: 50%;
width: 300px;
height: 100px;
margin: -50px 0px 0px -150px;
}
</style>
</head>
<body>
<table id="mycontent" cellspacing="0" cellpadding="0">
<tr>
<td><img src="bild1.gif" width="100" height="100"></td>
<td><img src="bild2.gif" width="100" height="100"></td>
<td><img src="bild3.gif" width="100" height="100"></td>
</tr>
</table>
</body>
</html>[/red]
nej jag får inte till det här. Detta är min utgångs kod.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>GIAB</title>
<base target="_self">
</head>
<body>
<table border="0" width="100%" style="border-collapse: collapse">
<tr>
<td>
<img border="0" src="Namnlöst-2%20kopiera.jpg" width="204" height="46"></td>
<td> </td>
<td>
<p align="center">
<img border="0" src="giab.gif" width="35" height="46" align="right"></td>
</tr>
</table>
</body>
</html>
Ända effekten jag är ute efter är att båda bilderna hamnar mitt på sidan i höjdled. I sidled ligger dom rätt.
Är det typ så här du menar?
[red] <table style="position:absolute; top: 50%; left: 0; width: 100%; height: 100px; border-collapse: collapse;">
<tr>
<td style="width: 204px;"><img border="0" src="Namnlöst-2%20kopiera.jpg" width="204" height="46"></td>
<td> </td>
<td style="width: 35px;" align="center"><img border="0" src="giab.gif" width="35" height="46" align="right"></td>
</tr>
</table>[/red]