Eliminar líneas verticales en jqGrid

Quiero eliminar las líneas mostradas en la imagen de jqGrid . ¿Cómo puedo eliminar eso?

Introduzca la descripción de la imagen aquí

jqGrid construye algunos divs adicionales sobre la tabla de cuadrícula principal. El div exterior tiene la clase ui-jqgrid . Entonces, si necesita eliminar el borde derecho e izquierdo existente en toda la cuadrícula, puede usar el siguiente CSS:

 .ui-jqgrid { border-right-width: 0px; border-left-width: 0px; } 

Si necesita eliminar todos los bordes de la cuadrícula puede usar

 .ui-jqgrid { border-width: 0px; } 

Si desea eliminar adicionalmente el borde vertical entre las celdas de la cuadrícula, puede usar

 .ui-jqgrid tr.ui-row-ltr td { border-right-color: transparent; } 

Para eliminar el borde horizontal entre las filas puede utilizar

 .ui-jqgrid tr.ui-row-ltr td { border-bottom-color: transparent; } 

Para eliminar los bordes verticales entre los encabezados de columna puede utilizar

 th.ui-th-column { border-right-color: transparent !important } 

o alternativamente (sin el uso de !important )

 .ui-jqgrid-labels .ui-th-column { border-right-color: transparent } 

(Ver la respuesta anterior )

Para que pueda elegir los estilos que necesite, dependerá de sus requisitos exactos. La demostración muestra los resultados en la aplicación de todos los estilos CSS anteriores:

introduzca la descripción de la imagen aquí

Si desea eliminar el borde a través de CSS , significa que tiene que cambiar el borde como none como en el siguiente.

En el archivo CSS, jquery-ui-1.8.1.custom.css (línea 53):

  #divid .ui-widget-content { background: url("images/ui-bg_inset-hard_100_fcfdfd_1x100.png") repeat-x scroll 50% bottom #FCFDFD; border: 0 none; color: #222222; } 

En lugar de cambiar su CSS en el archivo custom.css , puede hacer algo como esto en su CSS en línea:

 .ui-widget-content table#YourTableId { border: 0px !important; } 

¡No olvide !important , anulará el CSS definido para su tabla en un archivo CSS personalizado.

    Intereting Posts