CSS Text Wrapper te permite modificar el contorno de los párrafos de texto de nuestras páginas web, ya sea creando cÃrculos, zig-zags, o cualquier otra figura.
Hay dos formas de poder aplicarlo: mediante estilos o mediante un javascript. Existe un editor que nos ayuda mediante la creación de puntos, configurar el contorno de nuestro párrafo. CSS Text Wrapper
VÃa / WebAppers
Tener un grid con todas las filas al mismo tamaño puede ser algo difícil de conseguir. El problema viene con que CSS grid toma el tamaño de las filas según el tamaño máximo de sus celdas.
Para conseguir ello es necesario que el contenido de la celda tenga posicionamiento absoluto, y jugar con ::before para simular contenido vacío que rellene la celda:
Es curioso como el uso del pseudo-elemento :first-letter no es muy usado en la web, mientras que en papel si se suele usar con frecuencia. En este caso se trata de crear letras capitales mediante este pseudo-elemento. Para ello habrá que usar un fondo común para todas y luego modificar la letra inicial para que encaje en el marco.
Buenos consejos para realizar tus estilos CSS bien estructurados.
Se sencillo: usa solo que sea estrictamente necesario. No uses muchas capas div y puedes obtener el mismo resultado con una o dos. Si ves que la estructura se complica, quizás estés haciendo algo mal, intenta buscar otra forma muy sencilla.
Escrible claro: usa tabulaciones, comentarios para diferenciar partes y nombres que sean claros y explicativos.
Se metódico: usa los mismos nombres en tus proyectos. Agrupa por tipología y ordena alfabéticamente para una lectura más sencilla.
Organízate: diferencia y define las distintas partes para poder plasmarlas en tus estilos.
Resetea los estilos por defecto: debido a las diferencias entre los navegadores es conveniente dar estilos a algunas etiquetas HTML (ul, a, …)
Tabula los elementos: no solo uses el tabulador para los distintos estilos de un elemento, sino para crear una estructura de estilos, si un estilo depende de otro, deberá estar por debajo de este y con mayor tabulación.
These are way above and beyond the level of any other “CSS3 buttons” I’ve seen. Multiple backgrounds combining gradients and images, uneven border-radius, pseudo elements, HSL coloring, @font-face icons, transitions, box shadows, text shadows, hover and active states… the list goes on. Every trick in the book masterfully employed.They make my buttons …
Curioso y gratificante ver que no solo los nosotros sufrimos al IE, sino que los propios que trabajan en Microsoft lo sufren. En una de sus CSS se puede apreciar como una clase tiene el nombre StupidIEMarginHack y otra el nombre StupidIEWidthHack. Esto me recuerda la costumbre que solemos tener de poner trazas con insultos, palabras mal sonantes, … debido a la desesperación que sufrimos al desarrollar y que luego se nos olvida quitar.
Vía / Digg
Roger Johansson revisa su clásico “styling from controls“, artÃculo en el que mostraba cómo se ven los estilos CSS aplicados sobre los controles de formularios en diversos navegadores y sistemas operativos.
Demostraba además que intentar que los elementos de formulario se vean igual en todos los navegadores es una tarea imposible.
Roger acaba de publicar una revisión incorporando nuevos navegadores y sistemas operativos y agregando nuevos controles. En total revisa los siguientes controles en 14 combinaciones navegador – sistema operativo: