The more observant among you will notice that the background of the website has changed recently. I love my butterflies but since I’ve been putting up a lot of pictures of art lately something had started to bug me.
The site is built with a simple centered container – I wanted the background of the website to show through but very faintly (at about 5-10% opacity). When you just have text this looks great, but as soon as you start to add photographs you start to run into problems – the background shows through the image – this is because the opacity effects everything within in.
For example if I have div id=”container” etc. with an opacity of 95% applied to it, all the child elements of thatdiv will also have opacity of 95%…There is however a CSS solution – a trick – you need to create two background images and position them very carefully.