Avatar
Rosemary
Člen
Avatar
Rosemary:

Čauky :) mám na webovkách v CSS použité nějáké media queries, konkrétně
@media only screen and (max-width: 767px)
@media only screen and (min-width:767px) and (max-width: 960px)
@media only screen and (min-width:960px)
přičemž by se mělo teda jednat o 3 pozměněné vzhledy (upravená šířka stránky a u toho posledního přidáno nahoru záhlaví.
Teprv to zkouším. A chci se zeptat..

Když to otevřu v Mozille a nebo Chromu, tak při zmenšování okna se mi normálně mění vlastnosti stránky podle nastavení v queries, ale když v Chromu zapnu F12 a ten emulátor různých zařízení, vypadá to úplně stejně (všude je záhlaví a vůbec to nebere v potaz ta nastavení co tam mám)

I když si to otevřu u sebe na tabletu co má šířku tak 600px tak se to zobrazuje i s záhlavím a ne tak, jak je to u
@media only screen and (max-width: 767px)

Neví někdo, co s tím? Snad nebudu za blbečka :D Chci prostě různá zobrazení na různých rozlišeních :)

 
Odpovědět 16.10.2014 16:31
Avatar
Honza Bittner
Redaktor
Avatar
Odpovídá na Rosemary
Honza Bittner:

Tak ten emulátor nemusí fungovat korektně žejo... Vždy je lepší to zkusit na živo - tedy na nějakém tabletu, mobilu...

Nahoru Odpovědět 16.10.2014 16:36
Ptejte se mě na cokoli na https://github.com/HoBi/ama a followujte mě na Twitteru https://twitter.com/tenhobi. :-)
Avatar
Odpovídá na Rosemary
Vojtěch Mašek (Woyta):

Přidej si do hlavičky toto:

<meta name="viewport" content="width=device-width, maximum-scale=1.0, user-scalable=no">
Nahoru Odpovědět 16.10.2014 16:41
Výraz "to nejde" není v mém slovníku
Avatar
Rosemary
Člen
Avatar
Odpovídá na Honza Bittner
Rosemary:

No, ono i když mám jen ten průzkumník a koukám na stránky, u kterých to funguje tak je tam napsáno že používá třeba styl.css a za tím je @media only atp..
u mě je jen ten styl a ty queries tam nejsou. Něco tam mám určitě špatně, ale ještě nikdy jsem s tím nepracovala :D takže to budu muset asik všechno ozkoušet.

 
Nahoru Odpovědět 16.10.2014 16:42
Avatar
Rosemary
Člen
Avatar
Odpovídá na Vojtěch Mašek (Woyta)
Rosemary:

přidáno, ale nezměnilo se to :(

 
Nahoru Odpovědět 16.10.2014 16:48
Avatar
Odpovídá na Rosemary
Vojtěch Mašek (Woyta):

Zkus ještě upravit ty rozsahy tak, aby se nepřekrývaly, tzn:

@media only screen and (max-width: 767px)
@media only screen and (min-width:768px) and (max-width: 960px)
@media only screen and (min-width:961px)
Editováno 16.10.2014 16:54
Nahoru Odpovědět  +1 16.10.2014 16:54
Výraz "to nejde" není v mém slovníku
Avatar
Rosemary
Člen
Avatar
Odpovídá na Vojtěch Mašek (Woyta)
Rosemary:

teď to funguje už v tom průzkumníku, ale když to otevřu v tabletu, mám tam pořád ten normální vzhled co je i na počítač :) Přitom když otevřu třeba stránky
http://www.timebreak.cz/ přes ten tablet, mám normální tabletovou verzi, kterou tam oni maj jako
@media only screen and (max-width: 767px)

Asi to zkusím úplně od znova a uvidím, jestli to tam třeba nedělá nějáká blbost :)

 
Nahoru Odpovědět 16.10.2014 17:16
Avatar
Odpovídá na Rosemary
Vojtěch Mašek (Woyta):

Mě se osvědčilo zadávat pouze horní limit a přidávat pravidla od největšího k nejmenšímu, pak od sebe můžou dědit a je to míň kódu.

Nahoru Odpovědět  -1 16.10.2014 17:22
Výraz "to nejde" není v mém slovníku
Avatar
Jiří Gracík
Redaktor
Avatar
Odpovídá na Rosemary
Jiří Gracík:

Tablet nepatří pod screen, tam jsou pouze počítače. Tablety a telefony jsou handheld :)

Akceptované řešení
+20 Zkušeností
+1 bodů
Řešení problému
Nahoru Odpovědět  +1 16.10.2014 17:29
Creating websites is awesome till you see the result in another browser ...
Avatar
Rosemary
Člen
Avatar
Odpovídá na Vojtěch Mašek (Woyta)
Rosemary:

pozměnila jsem to na
<meta name="viewport" content="width=de­vice-width, initial-scale=1.0">
už to jde :) díky všem

 
Nahoru Odpovědět 17.10.2014 11:19
Avatar
Rosemary
Člen
Avatar
Odpovídá na Vojtěch Mašek (Woyta)
Rosemary:

To - je odemě a má to být +! Promiň, překlikla jsem se :)
a řešení je taky špatně zaškrnuto, moc to taj s tím neumím. Takže se omlouvám :D
Ale už je to tu uzavřeno, řešení jsem našla :)

 
Nahoru Odpovědět 17.10.2014 20:35
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 11 zpráv z 11.