The CSS float property is certainly one of the most obscure when you begin with CSS. As tricky as you may find it it is also one of the most powerful method of positioning.
First try to understand the concept of “flow” in a page. The normal flow of the page is from the top to the bottom. Each element have their own space and can’t overlap each other. Block element are displayed in columns and inline element in lines.
If you don’t have Smashing Magazine in your rss feed reader yet it’s about time to add it. Being one of the best web media related web magazine, they always pretty cool articles, giveaways and..free stuff. Have a look at the Freebies section to see what you can get for free. There is some pretty nice icon set, wallpaper and font.
Always useful in a toolbox!
A lot is happening on the Mozilla planet at the moment. First their fantastic web browser has been released in version 3 yesterday.
Here is a website that create loading gif for you. You choose the skin from a list of predefined skin and press create. That’s it. Useful when you want a common loading shape. You can even give it a color or make it transparent, change the background, etc…
Always good in a toolbox: http://www.ajaxload.info/
I nearly finished my styleswitcher for the gallery. It is basically a css switch coded in both javascript and php that change the CSS (green/black) to an inverted style (orange/white). I particularly like the use of the outline property I was talking about yesterday. A shame it only works for FireFox ^^’
The ressources I’ve used for this:
http://www.alistapart.com/articles/phpswitch
I think I’m gonna add some font size increase/decrease button to finish the switch. Any other ideas?
The outline property in CSS is more or less unknown. The first reason I think is because it only supported on Gecko based browser, even if it is part on the CSS 2 specifications. But you know standards…
It is a shame because it is an interesting property.
What outline does:
It is a bit like border, you specify a width, a style and a color. The shortcut is :
outline: width style color; (more…)
