Box Sizing
The “box model” in CSS works like this:
width + padding + border = actual visible/rendered width of box
height + padding + border = actual visible/rendered height of box
It’s a little weird, but you get used to it. …
The “box model” in CSS works like this:
width + padding + border = actual visible/rendered width of box
height + padding + border = actual visible/rendered height of box
It’s a little weird, but you get used to it. …
When working with HTML5 today, many of you know that you’ll need to include the “HTML5 shiv” to ensure that CSS will recognize and be able to style those elements in browsers that aren’t yet hip to HTML5.
<!--[if IE]>
…
This is a guest post by Jacob Gillespie who started an interesting thread on Forrst about this topic. I invited him to post it here, to which he graciously accepted.
Over the past several years, I have taken an interest …
The new CSS3 property border-image is a little tricky, but it can allow you to create flexible boxes with custom borders (or drop shadows, if that’s your thing) with a single div and a single image. In this article I …
CSS has a property called content. It can only be used with the pseudo elements :after and :before. It is written like a pseudo selector (with the colon), but it’s called a pseudo element because it’s not actually selecting anything …
I admittedly don’t think about this idea very often… how efficient is the CSS that we write, in terms of how quickly the browser can render it?
This is definitely something that browser vendors care about (the faster pages load …
It is a long-standing web design standard that the logo in the header area links to the homepage of the site. Another standard is that when displaying the navigation of a site, to highlight in some way the “current” page, …
There was a question in the forums about affecting non-hovered items. The effect they were after is that they had an unordered list of items and when they were rolled over, they would all dim (lower opacity) except the …
Did you know that you don’t have to link to an external image file when using an <img> element in HTML, or declaring a background-image in CSS? You can embed the image data directly into the document with data URIs. The end result can be a site with all the less HTTP Requests, but at what cost?
In the past we’ve covered adding +/- buttons to number-based inputs to help user interface (it’s easier than typing in some circumstances). Reader Hitesh N Chavda emailed me with the idea of doing it with the scroll of the mouse …