| Autor | Zpráva | ||
|---|---|---|---|
| Pavel Jé Profil * |
#1 · Zasláno: 9. 6. 2017, 11:46:30
Dobrý den,
narazil jsem po delší době na problém s responsivním designem na webu www.iphonepujcovna.cz. Ve všech prohlížečích funguje web správně, ale v jakémkoli Internet Exploreru je web totálně v háji. Protože tento prohlížeč nepoužívám nevěnoval jsem tomu až takovou pozornost. V podstatě pokud mi web funguje v Safari, Firefoxu a Opeře, tak neočekávám velké rozdíly v IE, ale tady v tomto případě je to teda šílené. Nevíte čím to může být? To se pro IE píše responsivní kód jinak nebo stačí jen něco vložit do hlavičky? Předem děkuji za pomoc! Pavel |
||
| Tomášeek Profil |
#2 · Zasláno: 9. 6. 2017, 12:01:37
Pavel Jé:
Explorery nikdy neuměly s media queries pracovat (nepodporovaly a tuším ani nepodporují). Řešením je psát desktop-first kód (pro explorery včetně), pro mobily pak responsivnit (IE bude ignorovat). Při mobile-first přístupu je třeba IE servírovat stylopis vzniklý průnikem responsivních částí, které jsou platné pro desktop, stejný jako při desktop-first. |
||
| Kcko Profil |
Pavel Jé:
Pro starší IE Ti pomůže github.com/scottjehl/Respond , navíc Ti tam chybí meta tag <meta name="viewport" content="width=device-width, initial-scale=1">
edit: tag tam máš, ale možná ho zkus přemístit někam nahoru, v IE 11 máš web skutečně rozsypaný, problém bude někde jinde. Tomášeek: Ale uměly, od IE 9, ověř si to, než napíšeš blábol. |
||
| Pavel Jé Profil * |
#4 · Zasláno: 9. 6. 2017, 12:20:13
Starší IE neřeším, postačí IE 9 nahoru, psát v dnešní době pro IE je horor a podporovat ještě ty starší, to snad není ani mým cílem. Proč však blbne web i na novějších, které si s media... poradí :/
|
||
| Kcko Profil |
#5 · Zasláno: 9. 6. 2017, 12:21:37
Pavel Jé:
Blbne Ti např. můj web? rjwebdesign.cz? Respond tam nemám. Dej si ten viewport někam nahoru, máš ho za JS smartlookem , nevím jestli to nedělá ten problém ... |
||
| Pavel Jé Profil * |
Neblbne, já to testuji tady: netrenderer.com
Mám Mac OS X tak to nemám jak otestovat. Viewport jsem dal nahoru a nepomohlo. Pomohlo oddělat tento řádek v css: @media all {html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, input, select, textarea, button { background: transparent no-repeat left top; border: 0; color: inherit; font-size: 100%; font: inherit; margin: 0; outline: none; padding: 0; vertical-align: baseline; }:/ ale zase to rozdupe něco jiného |
||
| Kcko Profil |
Pavel Jé:
a v @media all to máš proč? Naslepo: (S tímto vždy začínám HTML stránku) <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1"> |
||
| Pavel Jé Profil * |
#8 · Zasláno: 9. 6. 2017, 12:42:41
V podstatě ani nevím, proč to tam mám, v nějakém návodu to bylo že to vynuluje všechny "problémy"... ale asi to není až taková výhra..
|
||
| Kcko Profil |
#9 · Zasláno: 9. 6. 2017, 13:00:33
Pavel Jé:
Jestli Ti jde o to zresesovat prvky tak na to slouží necolas.github.io/normalize.css + nějaké odrůdy. Ten media all ani neznám, a očividně to dělá nějaké problémy. |
||
| Pavel Jé Profil * |
#10 · Zasláno: 9. 6. 2017, 13:03:31
Očividně to je akorát na škodu. Tak jsem rád, že se na to přišlo a minimálně až napadne někoho podobná blbost, tak ví, že to má dát pryč.
Díky za pomoc! Jdu to vyladit bez toho nesmyslu. |
||
|
Časová prodleva: 7 let
|
|||
0