Tag: PSEUDO-ELEMENT
Tengo una lista no ordenada con varios puntos de lista en HTML. En mi CSS, quiero seleccionar los puntos de lista 5 y 7. Entonces hago: .my-list li:nth-child(5), .my-list li:nth-child(7){ background: yellow; } Nada. Solo funciona con un solo número. Así que supongo que no puedo separarlos con una coma. . . . Read more
Tengo mi encabezado con el elemento ::after con una flecha. El elemento ::after está posicionado de forma absoluta con margin-left:10px, pero cuando reduzco el tamaño del sitio web, el elemento se envuelve hacia abajo con el texto. ¿Existe alguna forma de hacer que la flecha se mantenga siempre en la . . . Read more
En el siguiente fragmento de código, se transforma un pseudo-elemento cuadrado. Sin embargo, no entiendo de dónde proviene el espacio entre el <div> y el <p> que le sigue. <!– begin snippet: js hide: false console: true babel: false –> <!– language: lang-css –> .shape::after { –side1-em: 10; –side2-em: 5; . . . Read more
El siguiente código es para agregar una placa a una tarjeta. Código CSS funcional: .card::before { position: absolute; content: ""; background: #283593; height: 18px; width: 18px; top: 2.5rem; right: -0.7rem; z-index: -1; transform: rotate(45deg); } .card::after { position: absolute; content: "Sample Name"; top: 11px; right: -14px; padding: 0.5rem; width: 11rem; . . . Read more
Tengo un css definido de la siguiente manera: ul:before{ content:''; //otras definiciones de css } Lo que quiero es que el pseudo-elemento :before solo funcione cuando el UL tiene hijos LI, si el UL no tiene LI, hacer que el :before sea invisible. Gracias de antemano.