NOVINKA - Online rekvalifikační kurz Java programátor. Oblíbená a studenty ověřená rekvalifikace - nyní i online.
NOVINKA – Víkendový online kurz Software tester, který tě posune dál. Zjisti, jak na to!
Avatar
David Hynek
Tvůrce
Avatar
David Hynek:30.3.2016 0:14

Mám prosbu na zkušené. Dodělávám webové stránky s responsivním designem a narazil jsem na něco čemu nerozumím a nikde jsem nenašel odpověď. Stránky mám v třech pružných variantách pro velké, střední a malé displeje. Ladil jsem to přes pomocníka co je ve FF pro změnu velikosti stránek. Funguje to na všech prohlížečích jak má. ALE, když jsem to zkusil zobrazit na mobilu, kde se liší device-pixel-ratio (můj případ 1.34...) tak se mi některé bloky textu výrazně liší ve velikosti. Třeba P jsou normálně na 16px hezky čitelné, ale co je v A, LI a pod. jsou děsně malý mrchy a aby byly stejně velké jako text v P, musel jsem je zvětšit na 48px, tedy přesně 3x více. A má otázka zní, je to normální, nebo jsem prošvihl nějaké pravidlo, které se týká zobrazení webů na mobilu?
Předem díky za radu a nasměrování.

Odpovědět
30.3.2016 0:14
Čím víc vím, tím víc věcí nevím.
Avatar
Neaktivní uživatel
Tvůrce
Avatar
Odpovídá na David Hynek
Neaktivní uživatel:30.3.2016 1:10

A není to tím, že některé bloky nemají nastavenou velikost textu a telefon si ji přizpůsobí?

Nahoru Odpovědět
30.3.2016 1:10
Neaktivní uživatelský účet
Avatar
Tomáš123
Člen
Avatar
Odpovídá na David Hynek
Tomáš123:30.3.2016 12:14

Ukážeš nám kód tých prvkov? Ideálne celú stránku alebo ukážku v nástroji od Str4wberryho: http://kod.djpw.cz.

Pozoruješ problémy iba na mobile a iba u niektorých prvkov? Nezabudol si kdesi v kóde pre mobily nejaký font-size?

V akom mobilnom prehliadači to skúšaš? Nepomohlo by nastaviť veľkosť písma v jednotkách em?

Nezmenil si si kdesi v nastaveniach prehliadača nejakú veľkosť?

Nahoru Odpovědět
30.3.2016 12:14
Keby nebolo Internetu Exploreru, nebolo by dnešného internetu.
Avatar
Tomáš123
Člen
Avatar
Odpovídá na Neaktivní uživatel
Tomáš123:30.3.2016 12:14

Veľkosť textu je dedičná. Žiadne prispôsobovanie kvôli neuvedeniu sa nekoná.

Nahoru Odpovědět
30.3.2016 12:14
Keby nebolo Internetu Exploreru, nebolo by dnešného internetu.
Avatar
maxy obr
Člen
Avatar
Odpovídá na Tomáš123
maxy obr:30.3.2016 15:15

No to není tak úplně pravda, mobil si může velikost písma přizpůsobit pokud se mu nelíbí a hlavně pokud má na sobě jabko :D u jiných mobilů jsem se s tím nesetkal. Ale pravda nesouvisí to s tím, že by velikost nebyla definovaná ta klidně být může a i tak to udělá.

 
Nahoru Odpovědět
30.3.2016 15:15
Avatar
David Hynek
Tvůrce
Avatar
David Hynek:30.3.2016 22:13

odkaz přidávám... http://davidhynek.cz/…tstranek.php

odstranil jsem styly pro monitory a nechal jsem tam jen ten pro mobil.
Smazal jsem i všechny font-size, aby se to náhodou nepralo. Tak mi dejte vědět, jak se to ukázalo vám. Mám Nokii s Win8.1 zkoušeno na vestavěném prohlížeči. Seznamy a úvodní text je tam mrňavý...

Nahoru Odpovědět
30.3.2016 22:13
Čím víc vím, tím víc věcí nevím.
Avatar
David Hynek
Tvůrce
Avatar
David Hynek:31.3.2016 22:11

Tak odhaleno... skoro se stydím jak prostá to byla chyba :) kód stránky v HTML je potřeba doplnit ještě jednou meta značkou do hlavičky, ta zabrání úpravám stránky podle toho jak se mobilu zlíbí. Tedy, mobil si přestane upravovat velikosti stránky a prvků v ní.

<meta name="viewport" content="width=device-width,initial-scale=1">

Po vložení, už stránka finguje jak má :)

Nahoru Odpovědět
31.3.2016 22:11
Čím víc vím, tím víc věcí nevím.
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 7 zpráv z 7.