After three whole nights and more than 30 cups of tea, my blog is using a new version of my "deep blue" theme. Key new features are:
- Elastic CSS, this implies no more bitmap pictures :(
- Refactoring of DotClear2 template to shift the center of the page to the left. This leaves a small opening for a side image on the right. This is a new proof that my poor CSS skills cannot overcome the xHTML tags and document structure of the original DotClear2 pages.
- After many thoughts on the right CSS layout, I choose to use a CSS
width based on
em. Layouts based on page percent width are very tricky when it comes to displaying lines of code because text lines could be wrapped. CSSemattribute should garantee a similar appearance among screens and, let's dream, browsers. New pages width should be almost/at least 80 characters long. This might keep a text layout constant, even if you are zooming in/out, even if you are using different font sizes. Too wide or too big screens will be under-used. I don't care, use the space left to play with tiling window managers. Too small screens will have to go full screen and zoom out. Anyway if you cannot read 80 characters-long-line text, you should use another graphical terminal. (note: in fact, and perhaps due to limitation on the fonts, the length of text lines will never be constant. I've just tried to assure a minimal quality. See the next section for a concrete example) - Experimenting the CSS3 property
rgba(r,g,b,alpha)to add some eye candy. - Experimenting another CSS3 property with the
background-sizedeclaration to scale the background image to full page height. Strangely browsers like Opera zoom both text and images, this can lead to unesthetic result.