| Autor | Zpráva | ||
|---|---|---|---|
| Akira Profil * |
#1 · Zasláno: 5. 9. 2008, 23:15:55
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 |
#2 · Zasláno: 6. 9. 2008, 14:27:26
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 |
#3 · Zasláno: 6. 9. 2008, 14:29:42
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 |
#4 · Zasláno: 6. 9. 2008, 14:30:30
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 * |
#5 · Zasláno: 6. 9. 2008, 14:56:47
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 |
#6 · Zasláno: 6. 9. 2008, 16:46:03
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 |
#7 · Zasláno: 6. 9. 2008, 16:54:36
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 * |
#8 · Zasláno: 6. 9. 2008, 17:03:37
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 |
#9 · Zasláno: 6. 9. 2008, 17:04:47 · Upravil/a: joe
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 |
#10 · Zasláno: 6. 9. 2008, 17:26:31
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 |
#11 · Zasláno: 6. 9. 2008, 17:27:55
jak je to teď vůbec s používaností prohlížečů? Vyplatí se optimalizovat pro IE6?
|
||
| Manq Profil |
#12 · Zasláno: 6. 9. 2008, 17:29:50
Akira
Jo. |
||
| joe Profil |
#13 · Zasláno: 6. 9. 2008, 18:18:38
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 |
#14 · Zasláno: 6. 9. 2008, 18:45:12
joe
všechno má svoje mouchy. To moje řešení mi přijde mnohem elegantnější :) |
||
| joe Profil |
#15 · Zasláno: 6. 9. 2008, 19:02:58
Akira
Tobě jo, mně ne :-) Pak se ale nediv, že ti tam 1px nehraje... |
||
|
Časová prodleva: 16 let
|
|||
0