arrow-left arrow-right brightness-2 chevron-left chevron-right facebook-box facebook loader magnify menu-down rss-box star twitter-box twitter white-balance-sunny window-close
The transition is complete!
2 min read

The transition is complete!

I have switched CMS’s and have been hacking the new one up for the past couple of days. After moving my blog entries over from the other CMS, I began dissecting this current one until I was satisfied. As it stands now, the site contains no font or table tags. The positioning of everything is done through the CSS file and what are called ‘boxes’.

Because I wanted to keep the same layout as my previous design, I knew what I wanted before I began and so it was slightly easier when I started drafting the stylesheet. In a nutshell, it’s a 640px box which encloses two smaller boxes, one for the menu and one for the "content." Each of these smaller boxes is defined as "absolute," meaning absolute with respect to their container (the 640px box I spoke of earlier).

The only real snag I had, aside from the initial confusion over being table-less, was that for some browsers it was changing the position of the content block relative to the menu block. I narrowed this down to happening only when the content block was shorter than the menu block (ie, on my photo and contact pages).
This occurred in Netscape 7, Phoenix 0.4, Mozilla 1.2, and Opera 7.0 beta. Not surprisingly, all of those but Opera run the same rendering engine — Gecko. Also, Opera 7.0 is brand-new and is surely more standards-conformant than the old Opera 6.05 or IE 6.0, neither of which broke the layout. I did some research and have found that others are having the same problem (it’s essentially shifting one of the boxes 1px to the left/right).

I currently work around the problem by simply inserting break tags to make the content area on the broken pages as long as the menu. This resolved the problem in all of the problematic browsers. If I weren’t using the same stylesheet across all of the pages, then I guess I could just define the content box to be as long as the longest static page, but I am, and so I can’t do that as the main index page grows/shrinks dynamically.

All of the XHTML and CSS validate (check links at the bottom of the menu).

This should be it for a while as far as complete, under-the-hood renovations are concerned. Finals are right around the corner. When I get a chance, I’m going to add an archive section and link to it from the menu.

You've successfully subscribed to Justin Blanton.
Success! Your account is fully activated, you now have access to all content.