Autor Zpráva
dennis15
Profil
Dobrý den,
udělal jsem takový kod, ale nefunguje podle mé představy.
Proč se mi to napsalo takhle?

              Přesměrujeme Vás
            na nové stránky

Kod:

<html>
<head>
<title>Přesměrovávání...</title>
<style type="text/css">
.uprostred { position: relative; top: 50px; text-align: center; width=800px; height: 800px; background-image: url

('obd.png'); background-repeat: no-repeat; background-position: center; overflow: auto; }
.uprostred span{position: relative; top: 20px; font-size: 72pt;}
.uprostred img{position: relative; top: 400px; right: 325px; z-index: -1;}
</style>
</head>
<body>
<div class="uprostred">
<span>Přesměrujeme vás<br/>na nové stránky.</span>
<img src="ajax.gif"></img>
</div>
</body>
</html>

STRÁNKY
jenikkozak
Profil
Doporučil bych odstranit (zbytečné) relativní pozicování, nastavit prvku s třídou „uprostred“ šířku a zarovnat na střed. Pak se bude text zalamovat sám podle potřeby (bez nutnosti použití <br>) a bude možné jej i snáze stylovat.
Nyní je problém v tom, že <span> je řádkový prvek, který je zarovnán na střed. Druhý řádek je předsazený, protože do délky tohoto řádku je započítaný i ten obrázek, který je pak relativním pozicováním posunut dolů.
dennis15
Profil
jenikkozak:
Bohužel, můj největší problém je, že nevím jak prvek zarovnat v css na střed :(.
Už se mi díky absolutnímu pozicování povedlo vyjmout obrázek z toku dokumentu, takže s textem žádný problém. Ale potřebuji tedˇ celý div přesunout na střed.


jenikkozak:
Děkuji ti za pomoc, už jsem přišel i na to :)
Nastavil jsem divu zleva pozici 25%

Výsledný kod:

<html>
<head>
<title>Přesměrovávání...</title>
<style type="text/css">
.uprostred { position: relative; top: 50px; left: 25%; text-align: center; width: 800px; height: 800px; background-image: 

url('obd.png'); background-repeat: no-repeat; background-position: center; overflow: auto; }
.uprostred span{position: relative; top: 20px; font-size: 72pt;}
.uprostred img{position: absolute; top: 400px; right: 325px; z-index: -1;}
</style>
</head>
<body>
<div class="uprostred">
<span>Přesměrujeme vás na nové stránky.</span>
<img src="ajax.gif"></img>
</div>
</body>
</html>

Tady je náhled
jenikkozak
Profil
dennis15:
Nastavil jsem divu zleva pozici 25%
Jenomže to bude fungovat pouze v případě, že budeš mít obrazovku širokou 1600 px. Jedině tak bude kraj divu na 400. pixelu šířky.
Co třeba takto:
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Přesměrovávání...</title>
  <style type="text/css">
    body{text-align:center}
    div{background:url("obd.png") no-repeat;font-size:72pt;height:800px;margin:50px auto;padding:10px;width:800px}
    img{display:block;margin:200px auto 0 auto}
  </style>
</head>
<body>
  <div>
    Přesměrujeme vás na nové stránky.
    <img src="ajax.gif">
  </div>
</body>
</html>

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

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