Visualforce dataTable: ¿hay una manera para que deje de prestar atributo cellpadding?

Question

En Visualforce, estoy usando un componente <apex:dataTable> de la siguiente manera:

<apex:dataTable value="{!Qualifications}" var="qual" styleClass="cv_table" >
    <!-- etc...  -->

... y luego estoy usando CSS para el estilo de la mesa, a través del nombre de la clase. El problema es que Visualforce representa HTML siguiente:

<table class="cv_table" id="j_id0:j_id26" border="0" cellpadding="0" cellspacing="0">
    <!-- etc...  -->

El atributo de clase está allí como yo quería, pero también está cellpadding y CELLSPACING especificado, que interfiere con mi CSS.

¿Hay una manera de detener Visualforce de la prestación de los atributos cellpadding y cellspacing para una <apex:dataTable>?

Answer 1

Parece que el abandono de la etiqueta <apex:dataTable> y utilizando la etiqueta más <apex:repeat> baja fidelidad podría ser la única manera de hacer esto.

Answer 2

mencionado anteriormente, ¿ha intentado eliminar los atributos? Especificar el ID

<apex:dataTable id="myTable" value="{!Qualifications}"...

entonces

<script type="text/javascript">
  document.getElementById("myTable").removeAttribute("cellpadding");
  document.getElementById("myTable").removeAttribute("cellspacing")
</script>

Answer 3

¿Qué hay de proporcionar sus propios valores de los mismos (igual que en el CSS)? Feo, pero funcionaría.

Aparte de eso -? Atributo de extracción / volver a aplicar la clase con JavaScript

No creo que la eliminación incluso de SalesForce CSS (<apex:page ... showHeader="false">) va a realizar esta tarea.

Answer 4

No sé si se puede suprimir esos atributos en Visualforce.

Pero si la pregunta que realmente está pidiendo es ¿cómo puedo no dejar que esos atributos afectan mi diseño global, entonces creo que ayuda CSS lata.

El CSS equivalente de cellpadding es 'relleno', y el CSS equivalente de cellspacing es 'border-spacing'. Este último sólo funciona en elementos de tipo TD Por lo que yo sé.

.cv_table TD {
    border-spacing: 5px;
    padding: 5px;
}