Xyle Scope is a very cool piece of software. It is a browser for analyzing websites, particularly those built with a heavy reliance on CSS. It offers three views:

• Web browser – based on WebKit.
• Hierarchical navigator – a column view widget for browsing the HTML hierarchy.
• HTML pane – showing a properly formed view of the HTML
• CSS pane – shows the css styles that apply to the selected element in any of the other views.

Xyle Scope is very sweet. I’m sending in my box tops now.

This is very slick.

Rounded corners using CSS and a bit of JavaScript. I read the original article a while back and thought it was cool then too. But now that it supports IE 5.5 + I thinks that maybe I’m gonna need to included it in some of my projects. 🙂

Sometimes I’m an idiot.

<— Newsbar
            Content—>

I was trying to make this layout work back in January without any success. I was stymied by a complete lack of understanding of the float attribute. I had the Newsbar set to float: left and the Content set to float: right — WRONG! I just needed to float them both right. Had to fiddle with the Content width for IE Mac, but otherwise it was easy

I’ve been playing with the CSS layout again (as you can probably tell). But I’m finding browser bugs very frustrating… Basically, I’ve discovered that I do not know enough to work around them to the point where I can completely separate layout from content.

The sidebar (its called newsbar in my HTML and CSS) is in the footer Blosxom component so it arrives at the end of the HTML. In my previous layout, the newsbar and the copy were floated left and right respectively. This worked fine as long as there was a gap between them. When I tried to butt them together, I ran into issues getting IE to render the way I wanted.

Inknoise has a very cool tool for generating CSS layout and using it I can get the layout I want with the newsbar down the left hand side. Unfortunately the newsbar renders at the bottom of the page after the story content. I’ve tried playing with absolute positioning, but again I run into browser inconstancies. The only way I’ve managed to get it to work is to move the newsbar content to the Blosxom header component so it occurs before the story content. Not a big deal really, it would only mean editing a couple Blosxom components… but its the principle of the thing. I thought that CSS meant I wouldn’t have to muck with my content to get my layout to work.

Damn real-world implementations!

Sigh… So for the time being, this is the layout I’m going to stick with (until I redesign again). I’m not sure whether I like it or not, I’ll have to wait to see whether it grows on me..