Digamos que tenemos un div de la siguiente manera:Cómo cubrir un div
<div class="post">Variable text</div>
El texto puede ser por más tiempo. Por lo tanto, podría ser de 3 caracteres, 150 o 300. El div tiene un borde de border: 1 px solid black sobre un background: white. ¿Hay alguna manera de crear otro div (con la posición relative o absolute, supongo) que cubre completamente este div para que el texto no se pueda leer?
<div class="post" style="position:relative">
Variable text
<div style="position:absolute;top:0;left:0;width:100%;height:100%;background-color:white"></div>
</div>
Algo así podría funcionar, puede que tenga que jugar con el índice z para asegurarse de que su cuadro blanco esté en la parte superior. Básicamente, ese div interno comienza en la esquina superior izquierda del div externo y es del mismo tamaño que él.
¿Qué estás tratando de lograr? ¿Alguna razón por la que necesitas otro div?
Si sólo está tratando de ocultar los datos ¿Por qué no simplemente:
<div class="post" style="background-color:black;">Variable text</div>
Y garantizar su texto también es 'negro'
Debido a mi texto podría tener diferente color y las imágenes de color y otra en el interior 'span' . – Shoe
Bien, pero ¿por qué estás tratando de esconderte? ¿Se da cuenta de que el usuario podría simplemente ver la fuente? –
Estoy tratando de esconderme porque después de esa inmersión sobre la otra puedo agregar otro texto. – Shoe
No estoy 100% claro de por qué estás tratando de hacer esto, pero me preguntaba si has considerado ocultar tu div completamente usando la visibilidad: oculta; estilo css.
CSS:
.outer {
position:relative;
z-index:10;
}
.inner {
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
z-index:20;
}
CSS (sustitución de la imagen):
.outer {
text-indent:-9999em;
height:0;
padding:100px 0 0 0;
width:100px;
background-image:url(100x100.jpg);
}
HTML:
<div class="outer">
<div class="inner"></div>
Text to Replace
</div>
Te amo ... – Shoe