When working in percentages (for responsive design), all margins and padding (horizontal and vertical) are affected by width.This seems strange to me. For the moment I’m going with percentage based widths and pixel based heights – until I can find a better solution. I’m finding percentage based heights a little hit & miss at the moment…
I was looking for some social media icons to use on my site & came across the great Socialico set by Jelio Dimitrov. These are great but unfortunately don’t include an @font-face kit to enable use on websites. After some searching I found the mighty Fontsquirrel which converts fonts into a web font format & packs it all up neatly into an @fontface css file. Incredibly useful.
I was looking into responsive images last night & my image borders were causing problems when resizing the browser. I have used box sizing before didn’t really notice how useful this can be. After finding an excellent tutorial on css-tricks.com, I have now implemented box sizing throughout the site.
Had a go at these responsive menus that we all see kicking all over the internet. I’ve got everything working ok & looking good apart from the slide-down lists. After a lot of scouring on Google for solutions, it would appear the only sensible way to tackle this is via Javascript.
Great post on web designer depot (an incredibly useful site btw…) on serving web fonts into your designs. This can sometimes be tricky and confusing – I find the choosing of fonts more troublesome, however 😐
I was chatting to other students in class today about a css reset – there seem to be a few kicking about but I will probably implement Eric Meyer’s Reset CSS.
* Update – seems to be recommended by Liz Guy as well 🙂
Whilst Googling around for responsive menu tutorials I came across this great article by Ian Yates on Tuts+.
Important stuff.
* Update 10/04 Some great info in Peter Gasston’s “The Modern Web: Multi Device Web Development” book (pp 48 & 49).