Autor Zpráva
jirkaXXX
Profil *
zdravím
začal upravovat styly u stránky, ale v každém prohlížeči (IE9 a Chrome konkrétně) se mi stránka zobrazuje jinak (asi o 6 pixelů posunutá) doporučili by jste mi nějaký trik jak na to? aby se stránky zobrazovali všude stejně? popřípadě, jak udělat aby pro každý prohlížeč byl vybrán jiný styl
předem se omlouvám, nejsem zatím nijak moc zkušený. díky moc za rady
panther
Profil
jirkaXXX:
doporučili by jste mi nějaký trik jak na to?
nakódovat normálně, nebo dodat odkaz, aby někdo mohl najít chybu.
janbarasek
Profil
jirkaXXX:
Aby každý prohlížeč vybral jiný styl jde, ale je to pracný na údržbu. Prohlížeč můžeš zjistit přes PHP nebo JS. Jak na to si jistě někde najdeš.

se mi stránka zobrazuje jinak
Je to logické, každý prohlížeč si to dělá po svém.

aby se stránky zobrazovali všude stejně?
Použij víc absolutní pozicování. Sice je to občas prasárna, ale je to pak stejný. Musíš se s tím naučit.
panther
Profil
janbarasek:
Plácáš.

Je to logické, každý prohlížeč si to dělá po svém.
všechny prohlížeče berou CSS stejně/podobně (nepočítám vlastnosti, které některé prohlížeče neznají). Jsou dost jednotné, jinak by byl web neudržitelný.

Použij víc absolutní pozicování.
nesmysl.

Musíš se s tím naučit.
nesmysl. Pozicovat ano, ale ne teď a tady.
janbarasek
Profil
panther:
„Musíš se s tím naučit.“
nesmysl. Pozicovat ano, ale ne teď a tady.
Čim dřív začne, tim to bude pro něj lepší.

„Použij víc absolutní pozicování.“
nesmysl.
Je to jedna z možností, jak docílit stejného zobrazení.

všechny prohlížeče berou CSS stejně/podobně
Podobně, z vlastní skušenosti vím, že některý to berou docela s rozdílem. Velký rozdíl je třeba mezi linuxovým a widláckym prohlížečem.
joe
Profil
janbarasek:
Pokud se web zobrazuje špatně, je to chyba jeho tvůrce a ve špatně použitých stylech.
panther
Profil
janbarasek:
Čim dřív začne, tim to bude pro něj lepší.
pozicování ano, ne na stavbu layoutu nebo zaplácnutí chyb v CSS.

Je to jedna z možností, jak docílit stejného zobrazení.
to není pravda. Pokud se s pozicováním neumí zacházet, je ke škodě. Na stavbu layoutu není vhodné.

Podobně, z vlastní skušenosti vím, že některý to berou docela s rozdílem.
v tom případě asi jsi špatný kodér.


Ale protože se na to tazatel neptal, založ si vlastní vlákno, pokud chceš dále debatovat o svých domněnkách a (ne)schopnostech. Další příspěvky na toto téma odsud půjdou pryč.
Bubák
Profil
jirkaXXX:
doporučili by jste mi nějaký trik jak na to?
Začít tím, že IE bude ve standardním vykreslovacím režimu, Nevím, zda a jaký používáš !doctype, zkus tento:
<!doctype html>


Při tvorbě kontroluj stránku průběžně ve všech prohlížečích, získáš tím zkušenosti s tím, které konstrukce se v prohlížečích zobrazují různě a pak se jim budeš vyhýbat a budeš používat ty standardní. Též se můžeš dívat do kódů stránek, jak kódují zkušenější to, co ti zatím nejde.

Ještě mě napadlo, nemůže za těch pár px rozdílů prostor pro svislou rolovací lištu?

janbarasek:
Velký rozdíl je třeba mezi linuxovým a widláckym prohlížečem.
Tak to je teda blábol roku. Já viděl rozdíly pouze u písem, dostupných na té které platformě, v rozdílném antialiasingu a v odlišném vzhledu uživatelského rozhraní, jako rolovací lišty, tlačítka, roletky...
jirkaXXX
Profil *
díky moc za rady

doctype nepoužívám, protože nevím co to je, jsem začátečník...

to CSS které mi IE a chorme zobrazoval každý jinak jsem dělal kdysi dávno, třeba na této stránce: www.fe-fi.xf.cz (v IE zobrazí normálně, v Chormu se mi "pravy" div propadne dolu, Div "hlavni" se mi neprotáhne zároven s "levy"
nakonec jsem to zkusil celé přepsat, a funguje to na obojím zprávně...


tohle CSS (také špatné) zase naopak normálně zobrazí v Chrome, ale v IE je rozházené, odstavce které bych odhadl na to že nejsou v pořádku:
#hlavni{
	width: 800px;
	margin: 0px auto;
	text-align: left;
	background-color: rgb(70,120,0);
	min-height: 500px;	
	border: 3px solid rgb(0, 0, 0);
}

#pravy{
	background-color: rgb(50,150,50);
        width: 602px;
	float: left;
	min-height: 360px;
	text-align: right;
        padding: 20px 15px;
  
}

#levy{
	background-color: rgb(50,120,0);
	width: 150px;
	float: left;
	min-height: 360px;
	padding: 20px 9px;
}


rád bych věděl co je špatně, abych se příště mohl vyvarovat podobným chybám thx za odpovědi
panther
Profil
jirkaXXX:
doctype nepoužívám, protože nevím co to je, jsem začátečník...
doctype a následně módy prohlížečů.

Div "hlavni" se mi neprotáhne zároven s "levy"
protože má nastavenou pevnou výšku.

nakonec jsem to zkusil celé přepsat, a funguje to na obojím zprávně...
i ve firefoxu? Tam ne, pokud to přepsané je aktualizované na webu.

tohle CSS (také špatné) zase naopak normálně zobrazí v Chrome, ale v IE je rozházené
to CSS patří k jakému webu? Dodej odkaz, prosím.
jirkaXXX
Profil *
panther:
doctype nepoužívám, protože nevím co to je, jsem začátečník...
doctype a následně módy prohlížečů.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml-rdfa-1.dtd">

sry asi jsem to napsal trochu zmateně... takže znova

1.
dám příklad: moje dávné stránky, které IE bez problémů zobrazí, ale chrome má problém: http://www.vojta-je.borec.cz
css soubor těchto stránek: http://leteckaposta.cz/588615581

2.
abych nezakládal nový topic: http://www.vojta-je.borec.cz/new/index.php - nevíte jak odsadit vlastní stránku o několik cm doprava? zkoušel jsem v css souboru pozměnit padding u body (odstavec, kde mam nastavený obrázek na pozadí) třeba na:

body{
font-size: 0.9em;
padding: 10px 200px;
text-align: center;
background-image: url('../images/Background2.jpg');
}

v normálním offline režimu mi to funguje jak má, ale když to dám online... tak vidíte sami, jedno jaký prohlížeč, jen IE9 v kompatabilním režimu to zobrazí správně. napadá vás něco?

díky za pomoc
Davex
Profil
jirkaXXX:
ad 1) Součet šířek bloků #levy a #pravy je větší než vnitřní šířka obalového bloku, a proto se #pravý již nevejde vedle #levého a poskočí pod něj. V IE to funguje, protože viz [#10] módy prohlížečů: V čem jsou rozdíly módů v Internet Exploreru.
ad 2) Ve Firefoxu se o pár centimetrů posune. Nebylo by lepší použít pro obsah vodorovné centrování?
jirkaXXX
Profil *
použito, funguje, díky

abych nezakládal pořád další témata, rád bych se zeptat na několik dalších věcí

1. funguje vlastnost text-shadow v IE9? někde jsem našel že ano, někde že ne, tak nevím... ostatní věci z css3 mi tam jdou, tohle ne.

2. lze zobrazit css3 ve starších IE (8,7,6)? opět, někde jsem našel že to jde někde že ne... nebo nezbývá než klasicky řešit obrázkem na pozadí?

3. v OFFLINE režimu mi Chrome obrázek na stránce zobrazí, kdežto IE9. zkoušel jsem obrázek dát na internet (imageshack) a odkázat na něj, a pořád nejde. nefunguje jen tento ostatní to zobrazí, Online na stránce se zobrazí všechno. kod:

"
<img src="./images/obrazek.jpg" >
"
jelikož mi to nejde jenom Offline a jenom v IE9 tak je mi to v celku jedno, jen by mě zajímo co to je za jev

4. jde pouze v CSS udělat, aby se písmo po najetí myší zvětšilo jenom u jednoho slova? na té stránce ( http://www.vojta-je.borec.cz/new ) to horní menu jako kdyby odtlačilo i ostatní položky v menu. nedají se nějak upevnit, aby se ostatní položky nehýbali?

díky moc za rady
panther
Profil
jirkaXXX:
1) to si můžeš snadno vyzkoušet, nebo jako vodítko může sloužit tento přehled.

2) většinou ne. V osmičce něco jde, v sedmičce možná též něco málo, v šestce (téměř) nic. Opět viz přehled v bodu 1).

3) protiřečíš si. Buď je obrázek na imageshacku a odkazuješ celou URL, nebo je na tvém serveru a odkazuješ relativně (tvůj kód). Ve druhém případě se obrázek samozřejmě zobrazit nemůže.

4) nejsnáze nastavit pevnou šířku odkazům a dostatečně vysoký řádek. Ten je teď nízký, při hoveru se zvyšuje a zbylé položky poskakují.
Bubák
Profil
4. http://dero.name/weblog/kdyz-pri-hover-meni-text-svoji-sirku/
Ve "Shrnutí" je to hezky řečeno.
jirkaXXX
Profil *
1. nejde ok...

2. někde jsem našel, že to funguje, když dodám nějaké knihovny... máte nějaké zkušenosti s tím?

3. dal jsem odkaz <img src="./images/obrazek.jpg" >, který odkazuje na obrázek. stejný obrázek jsem dal na imageshack, a znovu odkázal na něj. Chrome oba zobrazil (stránka offline), IE9 nezobrazil ani jeden (pořád offline).

4. ok... zbytečné složité... raději si tam dám se třeba mění pozadí atp. ;)

thx za rady
panther
Profil
jirkaXXX:
ano, různé věci jdou udělat s různými knihovnami. Ta fíčura ale bude nedostupná bez JS a za druhé je to zbytečné, když lze nalézt alternativa z podporovaných CSS vlastností.
jirkaXXX
Profil *
panther:
alternativa z podporovaných CSS vlastností.

myslíš obrázky na pozadí, nebo něco jiného?
panther
Profil
jirkaXXX:
v případě kulatých rohů, stínů, atp. ano.

Jsou ale i další věci, které jdou udělat s pomocí vlastností obsažených v CSS2, nebo CSS3, resp. tak, aby fungovaly všude.
Např. odlišení první/poslední položky v seznamu lze dosáhnout buď třídou/id v HTML (podpora všude), nebo first/last-child. Totéž platí pro sudé/liché řádky tabulky: přiřazením třídy do HTML bude tabulkapruhovaná všude, za použití nth-child jen někde.

Příkladů se dají najít mraky. Někdo v tomto ohledu některé prohlížeče ignoruje se slovy: „Vše tam funguje, jen nebude pruihovaná tabulka, což nevadí.“. Někomu to nevadí, někomu ano. Podporuji starší prohlížeče i co se tohoto týče, ale neříkám, že je špatně je nepodporovat, jedná-li se jen o drobnosti ve vzhledu.

Záleží na uvážení každého.

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

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

0