CSS: semi-transparent border on images

When you display images on a white background (but also on other colors) you’d want to add a border to the image. But adding a ‘normal’ CSS border doesn’t always look very well. The solution: semi-transparant borders that are not positioned around, but on the images. This subtle design element will make your galleries look way […]

Create beautiful photo galleries with ‘Justified Gallery’

Organizing pictures of different sizes into a gallery can be a hard task, but using ‘Justified Gallery’, you can make good-looking — and responsive — photo galleries in minutes. ‘Justified Gallery’ is written in javascript, and renders the photos the same way as Flickr. First of all, you need to include the script and stylesheet, which […]

CSS: Simpele popover zonder javascript

Een eenvoudig popover maken voor een website is niet moeilijk. Hier een CSS/HTML voorbeeld om duidelijk te maken hoe eenvoudig het is.   HTML De HTML code voor het voorbeeld is triviaal: we hebben een container class, deze bevat het item waarover de cursor moet gaan om de popover te doen verschijnen. <div class=”container”> <div […]

Apple Mountain Lion Dock in CSS

Vele Apple-fanaten willen hun site een Mac look geven. Wat in zo’n design zeker niet mag ontbreken is natuurlijk de dock uit Mac OS X. Voor een Apple gerelateerde website, wilde ik dan ook zo’n dock gebruiken voor het menu. Op denbeke.be had ik dat al langer, maar deze dock was niet meer veranderd sinds […]

Rainbow Syntax Highlighting

Ik was al een tijdje opzoek naar een degelijke syntax highlighter om code snippets degelijk op te maken. Gisteren viel mijn oog op Rainbow, een syntax highlighter die gebruik maakt van Javascript en CSS. Hierdoor kan deze heel eenvoudig aangepast worden. Deze syntax highlighter heb ik dan in een WordPress plugin gegoten en een aangepaste layout gegeven […]