ExtJS: rimozione inutili barre di scorrimento elemento del modulo in Firefox

Question

Sto cercando qualche consiglio per quanto riguarda le barre di scorrimento che appaiono inutili su alcune voci del modulo. Uno screenshot del problema appare sotto. Nota è la più a destra della barra di scorrimento che non è necessaria.

bad_scrollbars http://img21.imageshack.us/img21/9307/scrollfu. png

Il colpevole sembra essere il seguente CSS, aggiungendo overflow: auto; agli elementi di forma all'interno di finestre browser basati su Gecko (il problema appare in Firefox):

.ext-gecko .x-window-body .x-form-item {
    outline: medium none;
    overflow: auto;
}

La rimozione di questo stile risolve il problema, ma sono diffidenti nei confronti di possibili effetti collaterali - anche se non ho notato alcuna finora, questo stile è stato, ovviamente, incluso per un motivo

.

Qualcuno che sa di più su Ext styling sapere se sovrascrivere questa CSS per rimuovere lo stile overflow: auto; causerà altri problemi?

Per inciso, questo è solo un problema (finora) con una certa componente - un'estensione personalizzata del componente Ext.ux.form.MultiSelect - anche se altri componenti utilizzano lo spazio più verticale. Qualcuno sa di una possibile ragione per questo?

Grazie per qualsiasi aiuto.

Answer 1

overflow: auto indica al browser di aggiungere una barra di scorrimento per l'elemento se il contenuto dell'elemento è più grande della zona del cliente elementi meno imbottitura. Come liberarsi delle barre di scorrimento in CSS fa esattamente questo. Rende le barre di scorrimento vanno via, non importa quale.

L'effetto collaterale del vostro lavoro intorno è se v'è contenuto al di fuori del cliente, l'uso non sarà in grado di vederlo. Inoltre, questo non accadrà solo con questa forma, ma ogni forma nell'applicazione meno che non si applica la vostra soluzione in una classe personalizzata.

La correzione giusta è quello di capire il motivo per cui la vostra area di contenuto è più grande area client del form. Firebug può essere di grande aiuto con questo, come si può ispezionare il DOM e vedere la dimensione del contenitore, così come la dimensione di tutti gli elementi figlio.

Ho il sospetto che il vostro controllo selezioni chiaro (è questo controllo un costume?) Non è correttamente il dimensionamento stesso (cioè nel modulo di layout che stai dicendo di essere di altezza x pixel, ma in realtà è il dimensionamento stesso x + 1 (ricordate i margini e imbottitura). il layout modulo sta facendo tutto il lavoro per decidere quanto grande per rendere l'area involucro (l'area con la barra di scorrimento) e il controllo deve rientrare in quella zona.