Autor Zpráva
Marsikus
Profil
Zdravím,

chci se zeptat, jak umístím jeden obrázek na přesně danou pozici tak,
aby od horní lišty prohlížeče byl odsazen 200px a na řádku vycentrován?

Zkoušel jsem:

   <div align="center"><img src="images/viewer.gif" alt="Orientační běh Žamberk"  width="325" height="305"></div>
(tady je to na řádku ok, ovšem ne na výšku)

   <span style="position: absolute; top:200px"><img src="images/viewer.gif"></span>
(a tady přesně obráceně)

Prostě nevím, jak to zkombit.
Děkuji.
Fisir
Profil
Reaguji na Marsika [#1]:
<img src="images/viewer.gif" style="position: relative; top: 200px; margin-left: auto; margin-right: auto; display: block; width: 150px;">
Someone [#3] ↓: Aha, nebyla definovaná šířka a vadilo position: absolute, co?
Someone
Profil
[#2] Fisir
Toto fungovat nebude.
Marsikus:
Je šířka obrázku pevně daná?
Marsikus
Profil
Myslíte jako velikost obrázku? Tak to ano..
..325px
Someone
Profil
V tom případě:
<img src="obrazek.png" style="position:absolute; top: 200px; left: 50%; margin: 0px 0px 0px -Xpx;" />
Za X si dosaďtě polovinu šířky obrázku... Pokud bude obrázek široký 200px, margin bude vypadat takto:
margin: 0px 0px 0px -100px;
Marsikus
Profil
Tak to mi funguje,
jen jakožto začátečník nechápu, co mi v této chvíli margin říká.
Ty nuly a poslední hodnota, co to znamená?
Someone
Profil
margin: 0px 0px 0px -Xpx;
je stejné jako toto:
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: -Xpx;
Takže se to dá zapsat jen takto:
<img src="obrazek.png" style="position:absolute; top: 200px; left: 50%; margin-left: -Xpx;" />
Marsikus
Profil
Ach tak.
Děkuji.

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: