Keskustelu: Nettisivujen teko: Kuvan laskeminen alaspäin

Hei,

Nyt tuli kyllä kummallinen ongelma. Minulla on sivu, jossa on td:llä taustakuva. Haluaisin siirtää toista kuvaa sen päällä 2px alaspäin, mutta mikään ei vaikuta:

<html>
<head>
<title>Mokkahabbo</title>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<table align="center" id="vali" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<img src="vasenyla.bmp">
<img src="oikeayla.bmp">
</td>
</tr>
<tr>
<td id="meadiaplayer"><div id="1"><img src="volume.bmp"></div></td>
</tr>
</table>
</body>
</html>]

body {
background-color: lime;
}

#meadiaplayer{
background-image:url("music.bmp");
width: 935px;
height: 53px;
}

img {
border: 0px;
}

div {
display: inline;
}

#1 {
margin-top: 2px;
margin-left: 40px;
}

Mistä tämä johtuu? Tuossa #1:n tilalla olen koittanut margin-top ja sun muuta laittaa, mutta ei toimi. Siis, pitäisi laskea kuvaa 2px alaspäin. Huom! Vain sitä yhtä kuvaa.

Padding-top #meadiaplayeriin ainakin pitäisi toimia. Tosin jos on muutakin sisältöä td:ssä, etkä halua niitä siirrellä niin tämä ei taida ratkaista ongelmaa.

Speksi sanoo, että ID ei saa alkaa numerolla.

Haa, paljon kiitoksia. :)

Lisäksi jatkossa kannattanee kuvat tallentaa webimuotoon. Tuo bmp on vähän turhan "raskas" webikäyttöön.

Tallenna siis kuvan sisällöstä riippuen jpg, png tai gif -muotoon.