Abstract Sequential Stephanie Hobson's abstract thoughts in the sequence she has them.

webdesign

Print Styles Are Responsive Design

In webdesign on 14 March 2012 with Comments Off

Print styles are the original responsive designs. Using media queries we pare down the content, focus on readability, and design with different device capabilities in mind but when was the last time you took a good look at your print styles? Yes, people still print web pages. Extrapolating from these numbers about 10,000 pages are [...]

CSS Loading Spinner

In webdesign on 6 September 2011 with Comments Off

I needed a loading spinner for a side project the other day but I was too lazy to steal someone else’s off the internet or try to re-learn making an animated GIF so I just coded my own in CSS (CSS is my hammer). On the bright side it works on any background colour and [...]

A style tag counts as a :first-child

In webdesign on 24 August 2011 tagged code, css, fix, html, html5, webdesign with Comments Off

EDIT 2011-09-15: All of this applies to <script> in the body as well. I have some bad news and a fix (I hesitate to call it good news). HTML5 introduces a way for us to include <style> elements on the page, we just need to give them an attribute of scoped. So, for example, if [...]

Perfect Stranger

In personal, webdesign on 16 July 2011 tagged accomplishment, fun, project, twitter with Comments Off

Twitter is an amazing tool to catch a glimpse of the collective consciousness. I’ve seen it during the Olympics and I’ve been apart of it at conferences like An Event Apart. Jeremy Keith once said that Twitter was the closest he’d ever come to feeling as though he’s jacked into the Matrix. Most of us [...]

A Dull April Fool’s Day

In webdesign on 16 July 2011 tagged accomplishment, april fools, bcit, black and white, desaturate, fun, joke, work with Comments Off

There was a rash of black and white April Fool’s Day sites this year. We weren’t the only ones to do it but I think we did it best, if I do say so myself. There were three parts to our little switch and it wouldn’t have been the same without any of them: Desaturating [...]

FireFox’s buttons are wider than IE or Chrome/Safari’s

In webdesign on 9 March 2011 tagged cross browser, css, form, html, pseudo, style, webdesign with Comments Off

I hate form styling on the best of days. This is a good example of why: Firefox’s buttons are wider than IE’s or Webkit’s. Why? This little gem in the browser’s style sheets: button::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="file"] > input[type="button"]::-moz-focus-inner { padding: 0px 2px 0px 2px; } That’s right, it’s 4px wider. Thank you FireFox. [...]

Taking a photo of yourself with an iPhone

In personal, webdesign on 15 September 2010 with Comments Off

Bullets alligned to the top of the text

In webdesign on 10 September 2010 with Comments Off

Know how IE and FF display list-style-image bullets at two different heights and it drives us all nuts? Did you know it was possible to use vertical-align on any inline element? Did you know that first-line is an inline element? If you’re working on displaying the bullets at the same height, this might be the [...]

CSS3 only cover flow

In webdesign on 28 May 2010 with Comments Off

Nothing teaches me how to do something like a project and I was trying to learn CSS3 so I tried to make a CSS only cover flow. Some of it works in FireFox but all the cool stuff works best in webkit: here’s as far as I got. Have fun with it :)

Web Hot. Beer Foamy.

In webdesign on 27 May 2010 with 6 comments

Like to talk about front-end web stuff? Like to do it with other people? Don’t object strenuously to the presence of beer or perhaps even see it as a benefit? Are you free June the 2nd between 5:30 and 8:30? Join others like you at Steamworks. Look for the girl in the hat (That’s me! [...]