gizstyle.com // grafica nell'animo

IE z-index BUG

giZ — Thu, 29 Jul 2010 09:06:58 +0000

Caro IE, se ti chiedo con una regola z-index di mostrarmi un determinato elemento sopra ad un altro, perchè tu devi fare quello che ti pare?
Insomma l’ennesimo bug di IE, da quanto ho capito indagando, il browser microsoft nelle sue svariate versioni interpreta lo z-index al contrario degli altri browser, impostando priorità di visualizzazione Z seguendo l’ordine HTML di creazione degli elementi e non ci sono regole CSS e forzature che tengano per cambiare questa visualizzazione se non intervenendo sulla disposizione HTML (cosa non sempre possibile).

Be per aggirare il problema esistono diverse soluzioni, reperibili velocemente cercando il “titolo del post” in google, ma tra le molte la più indicata che ho trovato, avendo a disposizione jQuery è questo veloce script che reindicizza tutti gli elementi della pagina assegnando loro uno z-index corretto.

$(document).ready(

function() { if($.browser.msie){

$(‘div’).each( function {

if($(this).css(‘position’)!=’absolute’) {

$(this).css(‘zIndex’, 1000 – (i * 10));

}});}});

Questa modifica permette ai vari Internet Explorer di riconoscere a dovere le regole z-index inserite nei notri CSS.

Leica X1

giZ — Mon, 05 Jul 2010 07:34:02 +0000

Ormai anni che, come saprete, mi interesso di fotografia; per passione e per appagare il mio senso estetico…Ma dopo aver completato un buon corredo Canon su tutte le fascie, da entry level 550D fino a livello Pro con la 5D MarkII, ho infine identificato il mio stile. Devo assolutamente ringraziare la OLYMPUS con il lancio dei vari modelli PEN tra i quali possiedo la EP-1 (sempre eccezionale adattando lenti classiche, design vintage e corpo in metallo) e ormai tutte le altre case che propongon sempre più modelli ultramoderni con corpi di infima plastica…

Passo così a presentare la mia ultima conquista, Leica X1, Leica crea questa compatta per una cerchia ristretta; caratteristiche prorompenti per essere una compatta con tutta la qualità Leica, la definizione di compatta si mostra solo nell’essere limitata ad espasioni, vedi obiettivo non intercambiabile, mirrorless e dimensioni minime, ma tutto è compensato da un sensore APS-C da 12.2 MP e il famoso obiettivo ELMARIT 24mm f/2.8 APSH.
Come dicevo è una Camera di nicchia, per sceglierla bisogna avere dimistichezza con obiettivi fissi semi-grandangolari, perciò non è così semplice da capire; per il resto oltre alle caratteristiche trovo eccellente il design Leica e la disposizione dei comandi manuali d’apertura e tempo di scatto, direttamente accessibili con le grandi ghiere sul top.
L’espressione di definizione e nitidezza dello scatto in RAW è eccelsa e il JPG è superiore a qualsiasi concorrente di fascia.
Accompagnata dalla sua borsa in pelle è un vero pezzo da collezione…

Le pècche? la batteria non ha una degna autonomia, se usata in live view (praticamente sempre), l’autofocus lento e fatica con bassa luminosità, vivendo con camere di concorrenza ci si accorge del grosso margine di miglioramento che la camera potrebbe avere anche solo via Firmware, perciò spero in un prossimo firmware che apporti importanti modifiche.

Di seguito lo slideshow in continuo aggiornamento degli scatti X1

Qui grazie a Steve Huff possiamo trovare reviews dettagliate della fotocamera.
Qui il link diretto al mio Set Flickr.

CSS Daily Tip: word-wrap spezzare parole lunghe

giZ — Fri, 25 Jun 2010 09:10:40 +0000

In ambiente di test a volte si inseriscono testi fittizi ance con parole molto lunghe, incontrando a volte errori di visualizzazione con queste parole che escono dai box di contenuto incidendo sulla impaginazione generale; per risolvere questo difetto per precauzione inseriamo la seguente regola per spezzare le parole a livello lettera in modo che vadano a capo:

word-wrap: break-word;

Link WebDesignerWall

CSS Daily Tip: position, overwrite to set default position

giZ — Fri, 18 Jun 2010 13:16:04 +0000

quando incontro certe necessità cerco di condividerle, nel caso di un elemento con “position:” che sia relative o absolute o che…non avendo possibilità di editare o eliminare questa regola, potendola solo sovrascrivere possiamo annullare la posizione resettandola di default con questa regola:

position:static;

Link W3 school…

CSS3 on IE, tecniche

giZ — Tue, 04 May 2010 16:26:47 +0000

Il supporto CSS3 in Internet Explorer è chiedere troppo, di recente ho trovato un articolo interessante su Smashin Magazine, come accenna il titolo sono proposte varie tecniche per ottenere effetti CSS3 come text-shadow, box-shadow, border-radius, gradienti, opacità, trasparenze e background multipli.
L’articolo è notevole e completo, lo trovate qui.

Ora non so se effettivamente tutte le soluzioni proposte siano funzionali o meno, si parla comunque di IE, leggendo l’articolo si nota come queste regole vadano a intervenire su regole proprietarie del motore web di microsoft e fortunatamente tra le versione IE6 7 e 8 si mantengono le stesse.
Per necessità il mio test è stato sul border radius, portare l’effetto angoli tondi sulle div per avere una coerenza visiva dei layout tra IE, Firefox e Safari/Chrome; l’ enhancer consiste nell’importare nel CSS un file border-radius.htc (.htc come il fix PNG).
Nel file CSS questa è la sintassi:

.box-radius {
border-radius: 15px;
behavior: url(border-radius.htc);
}

Si, la modifica funziona, o quasi, un div può ottenere angoli tondi su IE ma solo se ha dimensioni fisse e non viene modificato il suo aspetto una volta caricata la pagina, si perchè quando la pagina è completamente caricata viene applicata la modifica agli angoli; se le dimensioni cambiano, caricando del contenuto con chiamate ajax o effetti js, abbiamo dei difetti visivi, il div non cambia dimensione le regole di background vengono resettate in parte e una soluzione (-moz-border-radius:10px 10px 0px 0px) per definire il tondo per angoli specifici, non esistono…la modifica rende tutti gli angoli del div tondi.
Concludendo la modifica è molto limitata.