One Fine Jay

A eureka moment

Three months ago I asked about a CSS layout positioning techinique that involved floated elements, three columns, and whose sidebars came after the main content in the document structure. After a moment of inspiration from the Neptune theme (which my friend asked to tinker with because the content section was too narrow), I figured out how to combine Neptune‘s CSS with flexible layouts using negative margins, by Ryan Brill. Here’s a mockup:

Positioning diagram of the nested divs and float directions used in my little project.

Check out the live example, whose content explains the positioning and has a few additional notes. I know that a lot of WordPress theme development and other CSS development has gone past doing things like these, but if it helps someone, it’s all good. In fact, even if it didn’t, I’m glad that I was able to figure out a puzzle that’s bothered me for more than a year, and I’m glad that I’m writing about it.

2 Comments to A eureka moment

  • Podz says:

    That is spookily similar to my upcoming layout – apologies for not connecting what you had said to what I have done.

    I’ll mail you the link.

  • OF Jay says:

    Life would be far, far simpler if the layout I was tinkering with were fixed width. That would probably cut the non-semantic divs by two.

    By the way I saw what you sent me by mail. Looks good, although are those dots supposed to be piercing studs?

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>