Para contraer div yp por CSS

StackOverflow https://stackoverflow.com/questions/1304009

  •  19-09-2019
  •  | 
  •  

Pregunta

¿Cómo se puede contraer div y p -elementos si están vacíos por CSS tal que las etiquetas no se muestran para el usuario en el código fuente?

Estos elementos están en mi código fuente aunque están vacíos. Esto provoca errores con el resto del sitio.

corro este éxito 

div.unsuccessful,
div.unsuccessful p {
    visibility: collapse;                                                                                                                                                                                      
}

Esto me sugiere que al parecer no puede hacer tal cosa mediante CSS. Tal vez, se necesita otra herramienta como PHP.

¿Fue útil?

Solución

CSS tiene ninguna influencia en el código HTML real, así que esto no se puede hacer. En la (próxima) CSS3, puede que dejen de ser prestados utilizando la pseudo-clase :empty: 

div:empty {
    display: none;
}

Esto es, por supuesto, no es lo mismo, pero probablemente solucionar los problemas que tiene .. si sólo los navegadores admitidos realmente, lo que no lo hacen, sin embargo.

La mejor opción es para eliminarlos en el servidor, usando un lenguaje de programación como PHP. Supongo que podría hacerlo del lado del cliente con JavaScript, pero eso es una solución horrible, imo.

Una vez dicho esto, ¿qué problemas le tienen con estas etiquetas vacías? ¿Por qué están allí en primer lugar? Me parece que algunos rediseño está en orden, para evitar que las etiquetas innecesarias que se genere en el primer lugar.

Además, tenga cuidado. etiquetas vacías no siempre tienen sentido. De hecho, la eliminación de todos los <div> vacío por ahí puede ser considerado perjudicial.

Otros consejos

Sí, si desea dejar de ellos en la fuente , que necesita para hacer las consideraciones apropiadas en el código del servidor. Alternativamente, también puede configurar el código HTML en JavaScript, pero no es el método recomendado para este problema, probablemente. Es posible que quiera decir un poco más, sin embargo, en lo que estás tratando de hacer.

propiedad Visibility está destinado a establecer si el contenido del objeto se visualiza o no. No eliminará el elemento desde el interior del DOM.

  

Nueva colapso de Internet de Windows   Explorer 8

     

Se utiliza en las tablas para eliminar filas y columnas; para todos los demás elementos, mismos que oculta.

Además ¿por qué quieres hacer esto? 

div { display: none; }

elimina un elemento completo de la página.

Todavía va a aparecer en su código fuente , no importa lo que haces con CSS. El navegador combina el código HTML y las directivas CSS en una página visualizable, la fuente original no se modifica. CSS sólo puede influir en la presentación visual de los elementos, no puede alterar elementos. Para eliminar efectivamente los elementos del DOM que necesita Javascript (o no ponen los elementos allí en el primer lugar).

Sí, usted tendrá que utilizar el procesamiento del lado del servidor para mostrar o no presentas algo de código para el usuario: 

if ($showAdminLink) {
    echo "<p><a href=\"admin.php\">Admin panel</a></p>";
}

No importa qué trucos se intenta, todo lo hecho en el lado del cliente (HTML, JavaScript, CSS) puede ser alterado y jugó con.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top