16 entries tagged css

Redesign for my moribund web site

After months of apparent inactivity, you may have noticed that I have redesigned my site. At least, I have changed the visual design: the navigation is unchanged for now. Mostly the changes are in the CSS. Read more

No font-size-adjust yet

Today I have tweaked the CSS for the new look slightly: subheadings within articles no longer live in the left margin, and italics have gone a little curlier. Read more

My Own Fonts!

If you are reading my front page in Apple Safari 3, then you will see the headline in a nonsensical font I just invented. This is a novelty made possible by the combination of two different bits of work from unrelated corners of the interwebs: Safari’s support for the CSS web-fonts module, and a web-based font editor FontStruct from FontShop. Read more

Experiments with Large Banner Photos

It has become fashionable to head an article with an edge-to-edge banner photo. I have been thinking about how I might make this work with as little CSS and JavaScript as possible. Read more

CSS and content-outwards versus layout-inwards design

I had a moment of existential panic this week over an esoteric technical point t do with out outsourced stylesheets: our builder has set the default box model to not be content-box but border-box! The difference represents the final end of the original vision of CSS as a content-outwards style language. Read more

Why my Web Fonts Suddenly Stopped Working

New versions of browsers have come out that extend the Access-Control-Allow-Origin header to control access to fonts as well as to JavaScript files. This means that on all my sites—personal and professional—that use webfonts, they have reverted to using default fonts, with ugly results. Read more

Responsive Grids of Cards with Less CSS

One of the problems with CSS is that you can do most layouts in many different ways, because most layouts only work by accident. The trick is to find a way to get the effect you want that is reasonably clear to future readers of the code and adaptable to different viewport widths without introducing an excessive number of overriding definitions. Read more

The Cascade Trap

The Cascading Style Sheets language has this neat featured called the cascade, where an element on your page acquires its value for a property from the most-specific of several applying rules in the style sheet. This is a feature that should be used sparingly if you don’t want your style sheet to balloon in to a mess of overrides. Read more

Slimming My Blog Page

After reading the text version of a talk by Maciej Cegłowski titled The Web Obesity Epidemic I felt pretty smug because I thought I had redesigned my blog on reasonably minimal lines. Then I checked and was chagrined to discover a recent entry page was 1.01 MB compared with Maciej Cegłowski’s entire talk weighing in at slightly less than 1 MB. I decided to try to work out where I went wrong. Read more

iPhone Landscape Zoom Prevent

Writing the CSS for a responsive or mobile site and it inexplicably zooms in when I turned the phone in to landscape mode. I want it to show more text when I rotate, not enlarge the text that is already there. Read more