If this is going to be an all-singing, all-dancing validating dream of a theme, shouldn't the rendering order be "content first"?

I know it might add CSS woes to some of the less experienced developers out there, but this seems a pretty important issue to me.

Comments

jjeff’s picture

jjeff commented

I'm all for content first!

Are you volunteering to handle the CSS woes? I would happily commit a patch that moves the content first and works cross-browser.

TobiasH’s picture

TobiasH commented

The order: middle column, sidebar left, sidebar right needs IMO two extra div's.

<div class="outer-container"> /* at the moment class="container" */
  <div class="inner-container">
    <div class="source-order-container"></div>
  </div>
</div>

An example you can find at http://webhost.bridgew.edu/etribou/layouts/skidoo_redux/index.html.

niklp’s picture

niklp commented

Nah you just need one more container: you get the content rendered first, then the left col (float these), wrap these in a container, float that left and then float your right column and you're laughing. It's not much fun but I will contribute the CSS for this when I'm on my next project and I've got control of that part of the proceedings! :) Browser hacking is not much of a forte of mine, but generally I try to code against as basic a CSS model as possible, in order to get around this problem.

I'll have a bit of time to spend on this in a couple of weeks hopefully.

johnalbin’s picture

johnalbin
they/他
Primary language English
Location Taipei, Taiwan
commented
Assigned: Unassigned » johnalbin
Category: task » feature

This would require scraping the Garland-based CSS in favor of a different CSS layout technique.

I’ve got one handy that I’ve been using/improving for the past 4 years (at a webdev company). I’ve only used it on fixed-width layouts, but I have some ideas on how to accomplish a full-browser-width version.

johnalbin’s picture

johnalbin
they/他
Primary language English
Location Taipei, Taiwan
commented
Status: Active » Fixed

Fixed in 5.x-1.x-dev!

The new source order is:

  1. Header
  2. Breadcrumbs and Content *
  3. Horizontal navigation bar with Search form, Primary links, and Secondary links *
  4. Left sidebar *
  5. Right sidebar *
  6. Footer
  7. Closure

Also, the new CSS layout method allows you to re-order the divs with the asterisks in your html without changing any CSS.

Anonymous’s picture

(not verified) commented
Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for two weeks with no activity.

johnalbin’s picture

johnalbin
they/他
Primary language English
Location Taipei, Taiwan
commented
Component: Code » layout.css
Issue summary: View changes

Link to commit: http://cgit.drupalcode.org/zen/commit/?id=88b869aea892ed550805dbe9af7211...