Video, audio, and images are all types of multimedia.
Currently only images are aloud in our CSS. In many cases video and audio require controls and are a core part of the page content. Sometimes, though, they are strictly used as background decoration and do not require controls.
Let’s say you want an infinitely-looping full screen video as your homepage background (like this one: marisapassos.com). Your only option is to include it in your HTML. That works, but if the video is essentially decoration or serves as a supporting style for the real content (in the HTML), then I say it belongs in the presentational layer (the CSS).
As a fun little task for myself, I marked up my initials (CBPN) in a list and styled them around an ×. The main thing to take away from this example is that everything is em-based, so that changing the htmlfont-size will perfectly scale the entire project.
I encourage you to play around in my code and come up with your own variations.
Touch is the simplest and one of the most powerful forms of communication.
In this article, I will take a look into the possible future of CSS, the presentation layer of the web. I will be exploring touchable textures and how they could be applied in CSS to texture-enabled devices. By textures, I’m referring to the feeling of three dimensional surfaces like, smooth or bumpy, applied to a two dimensional surface of a device (or future 3D surfaces). Though this type of technology may not be readily available today, it’s certainly fun to imagine how texture styles may be implemented.
Experimental code ahead. The following code doesn’t exist…yet.
My (rather crude) proposal is for a texture property in CSS:
Ever since I found out about the hidden gembox-sizing:border-box, I’ve used it on most all my projects. While fiddling around with border-box, I learned the * universal selector box-sizing declaration didn’t apply to my pseudo elements.
So, to apply box-sizing:border-box to everthing, use: