Autor Zpráva
Akira
Profil *
Ahoj, řeším takový záhadný problém s prohlížečem Opera. Některé prvky na stránce jsou posunuty doleva o 1px. Vše by mělo být nastylované správně, rozměry sedí. Ostatní prolížeče problém nemají.

Kuriozní je, že stačí, abych v Opeře zobrazil ten postanní panel a vše se srovná.

Stejně tak, pokud stránkou zazoomuji. Jednou se prvek posune doleva, pak zase doprava a v určitém stupni zoomu se to srovná.

Pro nároznost posílám obrázky.

Posunutí obálky u vizitky a patičky
Po zobrazení postranního panelu je všechno tak, jak má být

Nesetkal jste se prosím s tímhle někdo? Díky...
Strajk
Profil
Je to tím tím že okno prohlížeče má lichou šířku a při snaze o vycentrování je tam ten jeden pixel navíc tak to poskočí...

Já sem to řešil javascriptem takto (samozřejmě si to musíš upravit trochu pro sebe)
if (document.viewport.getWidth() % 2 == 0) {
	$('container').style.left = '-1px';
} else {
        $('container').style.left = '0px';
}


#container musí mít position: relative
Strajk
Profil
Ještě se koukám že tam mám nějaký funkce z prototypu který v základním js nejsou takže je potřeba to trošku upravit, ale princip zůstává stejnej :)
joe
Profil
Akira
Ještě se mi to nikdy nestalo a to Operu používám převážně. Ukaž kód, určitě to jde řešit i jinak, než JS.
Akira
Profil *
Starjk
Děkuju, v případě nouze vyzkouším tvůj kód, Ale zatím bych radši vyzkoušel jiný způsob.

joe
Vytvořil jsem narychlo testovací stránku, když budeš mít chuť, tak se na to prosím podívej. Dík...

Obrázek v hlavičce se posouvá doleva
Strajk
Profil
Není to operou, dělá to každý prohlížeč... zkus si po jednom pixelu zmenšovat okno prohlížeče a uvidíš jak to skáče
joe
Profil
Akira
1) Nelíbí se mi jak máš v jednom obrázku pozadí okolo stránky a zároveň samotnou stránku.
2) U #header bych nastavil width: 100%;
Akira
Profil *
joe
1) Pokud znáš lepší způsob, jak dosáhnout stínu po stranách stránky při použití dekorativního pozadí, tak jsem s ním :)
2) width: 100% nefunguje - zkoušel jsem

Strajk
Máš pravdu. Dělá mi to i u FF. Ale tam se jen při zazoomování, tak že to tolik navadí. Opera posouvá i bez zoomu.
Skutečně není jiný způsob než javascript? Přijde mi to jako docela zásadní bug v prohlížečích...
joe
Profil
Akira
Zkusím to, pak zedituju tenhle příspěvek, tak moment :-)

Kód
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
<style>
* { padding: 0; margin: 0; }
body { background: url("images/back.png"); text-align: center; }
#all { width: 760px; margin: auto; background: #fff url('images/page-back.png') repeat-y; height: 100%; }
#header { width: 750px;margin: auto; height: 300px; background: url("header.jpg"); }
</style>
</head>
<body>
<div id="all">
<div id="header"></div>
</div>
</body>
</html>

Obrázky
Obrázek back.png je jen opakující se vzorek na pozadí, ještě je dobřé přidat do css barvu.
Obrázek page-back.png je bílé pozadí se stíny na okraji.

Je to jedno z několika dalších řešení jak bych to udělal...
Akira
Profil
joe
jj, i takhle by to šlo. Menší vada tvého řešení je, že IE6 neumí zpracovávat průhlednost u PNG. Místo stínu se pak zobrazí jen šedý pruh. Ale pokud je někomu kompatibilita s IE6 ukradená, tak proč ne...
Akira
Profil
jak je to teď vůbec s používaností prohlížečů? Vyplatí se optimalizovat pro IE6?
Manq
Profil
Akira
Jo.
joe
Profil
Akira
Stránky, které netvořím pro sebe, dělám kompatibilní s prohlížeči IE5.5+, Opera, FF, Safari, takže určitě od ničeho neodsekávám IE6, protože se ještě trochu používá, také záleží pro jakou věkovou kategorii je web určený.

Dá se na to použít například pngfix a nebo to nechat v obrázku a vedle toho stínu by to ale nenavazovalo. A pokud se ti to nelíbí, v IE můžeš stín "dát" pryč.
Akira
Profil
joe
všechno má svoje mouchy. To moje řešení mi přijde mnohem elegantnější :)
joe
Profil
Akira
Tobě jo, mně ne :-) Pak se ale nediv, že ti tam 1px nehraje...

Vaše odpověď

Mohlo by se hodit

Nezapomeňte na odkaz na živou ukázku problému.

Prosím používejte diakritiku a interpunkci.

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