chalda.it
19ott/090

Come evitare che firefox tronchi le pagine nell’anteprima di stampa

Firefox è un ottimo browser, ma per quanto riguarda la stampa lascia un po' a desiderare.
Non è difficile imbattersi in anteprime di stampa abnormi, in cui viene visualizzata solo una pagina di contenuto e il resto scompare misteriosamente...

Per ovviare a questo problema creiamo una pagina di stile alternativo per la stampa, che chiameremo print.css, ed inseriamo le seguenti righe:

#idcontenitore {
   display: inline;
   overflow:visible;
}

Poi linkeremo lo style nel nostro template con la seguente riga:

 <link rel="stylesheet" type="text/css" href="print.css" media="print" />

Ora l'anteprima di stampa di firefox dovrebbe tagliare le pagine in modo corretto!

19ott/090

Settare l’altezza di un div a 10px o meno in ie6

Certe volte si ha necessità di settare un'altezza minima a un div, ma ie6 non ne vuole sapere e setta una sua "Altezza minima".

Questo perché ie6 HA un'altezza minima per gli elementi: l'altezza del carattere.

Per ovviare al problema inserire nel CSS:

#div{
   height:5px;
   line-height:0;  /* Altezza riga a 0 */
   font-size:0  /* Dimensione Carattere a 0*/
}
24giu/092

Come rimuovere il bordo tratteggiato alle immagini sul click

Quando si clicca su un pulsante, div con background o altra cosa grafica compare un fastidiosissimo bordo tratteggiato.

Per toglierlo basta inserire negli stili

a:active{outline: none;}
a:focus{-moz-outline-style: none;}

E il gioco è fatto!

11giu/090

Come risolvere il bug del “testo fantasma” in ie6

Cos'è il testo fantasma?

Il testo fantasma è una parte di testo che compare senza alcun motivo dove non dovrebbe, solitamente una ripetizione di una parte di testo in un'altra pagina.



Il problema è causato dal float:left, per cui basta evitare di inserirli :-)



In alternativa provate questi workaround che ho trovato:

  • Commenti: Non si sa il perché ma i commenti nel codice (<!-- -->) creano questi problemi. Provate a rimuoverli
  • Float: Il float da sempre strani problemi, provate ad aggiungere lo stile display:inline ai div con float
  • Ultima soluzione che ho trovato è quella di aggiungere un margine negativo ai div

Se avete altre soluzioni...
Scrivetele nei commenti :)