Popular:

Markup Tutorials

  • By
    Wrap Long Links with CSS

    Developers have loads to think about when creative websites, and much of that is ensuring child elements don't stretch past the parent width.  We worry about images, IFRAMEs, and other popular elements pushing past their parent width, but then we see a basic link with a long...

  • By
    Creating Scrolling Parallax Effects with CSS

    Introduction For quite a long time now websites with the so called "parallax" effect have been really popular. In case you have not heard of this effect, it basically includes different layers of images that are moving in different directions or with different speed. This leads to a...

  • By
    7 Things You Didn’t Know You Could Do with CSS

    CSS and JavaScript, believe it or not, are starting to overlap as CSS adds more functionality. When I wrote 5 Ways that CSS and JavaScript Interact That You May Not Know About, people were surprised at how CSS and JavaScript have come to overlap.

  • By
    Preview: Element Queries, From the Feet Up

    Element Queries, what are they? Have you ever wanted to style an element using something like Media Queries, but based on *its own* dimensions instead of the browser's viewport? That's what Element Queries would provide. Having this ability would make responsive styling of layouts and components easier...

  • By
    How Nesting 3D Transformed Elements Works

    CSS animations are incredibly popular right now, and I don't just mean animating a simple color or dimension property, I mean 3D transformations as well; CSS flips and rotating cubes being prime examples. We can find simple CSS snippets and examples for transforms, but...

  • By
    Startup Framework: Website Builder, Bootstrap Themes and More

    One conclusion that I've come to when evaluating my skills is that I'm not a designer.  Each time I redesign this blog, I identify a few sites I like and then meld them together.  Of course that means I end up with UI components that...

  • By
    Link HREFLANG

    If you work on a website that is offered in more than one language, you deserve a medal.  The need to localize almost everything is tough and sometimes feels very limiting.  No adding text to imagery, never knowing how different translation will affect layout, maintaining different...

  • By
    Accessibility and alt Attributes

    The alt attribute is important for a number of reasons:  it describes an image for screen readers used by those without sight or poor sight, it describes the image to bots, and it provides an indicator of what should have loaded if the image fails to...

  • By
    Prevent Wrapping of <code> Tags in Text

    Writers of technical documentation (or lowly blog writers like myself) oftentimes put property names in <code> tags within blocks of text. Doing so makes reading the text easier and prevents users from misconstruing explanatory text with property names. CSS uses a dash within its...

  • By
    Truly Responsive Images with responsive-images.js

    Responsive web design is something you hear a lot about these days. The moment I really started to get into responsive design was a few months ago when I started to realise that 'responsive' is not just about scaling your websites to the size of your...