Sto cercando di capire come funziona questa proprietà. Ho fatto un div ad altezza e largezza fisse con il display:table-row e con vertical-align:middle . Al suo interno ci sono un' immagine affiancata da diversi pulsanti, ognuno (anche l' immagine) con display:table-cell . Se ho capito bene cosa significa questa proprietà dovrei visualizzare gli elementi del div affiancati uno all' altro, ed è quello che vedo in IE e Firefox. In Chrome invece i pulsanti vanno a capo rispetto all' immagine. Come mai?
Ecco il css:
E l' html generato:codice:#testa { height:80px; width:100%; padding:0px; margin:0px; display:table-row; } .imgtesta { display:table-cell; vertical-align:middle; } .btntesta { display:table-cell; vertical-align:middle; background-color:#aca; padding:15px; display:inline-block; margin:10px; cursor:pointer; position:relative; } .btntesta:hover { background-color:#eee; }
I pulsanti hanno la doppia classe perchè uso una classe javascript per gli angoli arrotondaticodice:<div id="testa"> <input type="image" name="ctl00$img1" id="ctl00_img1" class="imgtesta" src="img/sfondo1.jpg" style="border-width:0px;" /> <input type="submit" name="ctl00$btnhome" value=" Homepage " id="ctl00_btnhome" class="btntesta rounded {transparent}" /> <input type="submit" name="ctl00$btnmusica" value="Musica " id="ctl00_btnmusica" class="btntesta rounded {transparent}" /> <input type="submit" name="ctl00$btnclass" value="Le classifiche " id="ctl00_btnclass" class="btntesta rounded {transparent}" /> <input type="submit" name="ctl00$btncerca" value="Cerca " id="ctl00_btncerca" class="btntesta rounded {transparent}" /> <input type="submit" name="ctl00$btnentra" value="Entra " id="ctl00_btnentra" class="btntesta rounded {transparent}" /> <input type="submit" name="ctl00$btnreg" value="Registrati " id="ctl00_btnreg" class="btntesta rounded {transparent}" /> </div>

Rispondi quotando
