[RISOLTO] Layout caratteri. Edge vs. Chrome

[aex]

Ho notato che con Edge e zoom al 100%, in generale le pagine web vengono visualizzate con caratteri più piccoli, mentre con Chrome (sempre con zoom al 100%) i caratteri sono molto più grandi.

Quale è il browser che restituisce un layout più fedele. C'è un metodo o servizio on line, free, che permette di vedere come viene visualizzato un sito, con i browser più comuni? Perchè non capisco queste differenze enormi.

[giusebos]

Nessuno direi.
Realizzando un template si parte da una serie di regole che resettino i vari stili dei vari editor.
Ci sono abbondanti guide e tools proprio per questo scopo.

webhouseit.com/fogli-di-reset-css-quale-scegliere/

uno dei più noto progetti è "normalize"

http://www.webhouseit.com/fogli-di-reset-css-quale-scegliere/

[aex]

Nessuno direi.
Realizzando un template si parte da una serie di regole che resettino i vari stili dei vari editor.
Ci sono abbondanti guide e tools proprio per questo scopo.

webhouseit.com/fogli-di-reset-css-quale-scegliere/

uno dei più noto progetti è "normalize"

http://www.webhouseit.com/fogli-di-reset-css-quale-scegliere/

Quindi dovrei sostituire il css che ho con  "normalize" e mi andrebbe a resettare tutto il foglio di stile. In questo modo devo mettere mano da zero. Giusto?

[giusebos]

no, devi applicare lo stile al tuo template facendo leggere questo file per primo fra tutti i css

[aex]

Come faccio a farlo leggere prima di altri?

[giusebos]

cambiando l'ordine di chiamata al file ne file index del template.

Se usi un framework il file potrebbe essere un'altro

[aex]

Nel file index ho queste cgiamate

$doc->addStyleSheet(JURI::root(true).'/templates/system/css/general.css' , 'text/css', 'all');

$doc->addStyleSheet($filepath.'/css/bootstrap.css' , 'text/css', 'all');
$doc->addStyleSheet($filepath.'/css/font-awesome.css' , 'text/css', 'all');
$doc->addStyleSheet($filepath.'/css/template.css' , 'text/css', 'all');
$doc->addStyleSheet($filepath.'/css/print.css' , 'text/css', 'print');

Se chiamo prima il css di normalize e poi carico di nuovo il template.css, mi ritroverò ancora il foglio css che vorrei sistemare.

[giusebos]

alla prima riga aggiungi il riferimento al file normalize

$doc->addStyleSheet($filepath.'/css/normalize.css' , 'text/css', 'all');

naturalmente poi trasferisci via ftp il file nella cartella css del template

Considera anche eventuali aggiornamenti futuri del template, fai le tue considerazioni ed agisci di conseguenza.

[aex]

Scusa ma mi puoi dire cosa fa il css normalize, se poi come seconda istruzione va a caricare di nuovo il css del template?

[giusebos]

normalizza le dimensioni dei font e di tutti quegli stili che i vari browser applicano in mancanza di regole da parte del template.

se vuoi approfondire basta che fai una ricerca.

[aex]

Si, avevo già trovato.
Senza fare un reset del css fa una normalizzazione cross-browser, risolvendo eventualmente anche dei problemi di codice. Sicuramente utile.