I may just not have played with this long enough, and even more hesitant to put this in a bug report, but decided it may be appropriate since Marina is stated to work well with panels and the grid system. I have just started using Acquia Marina sub-themed off Fusion Core and I absolutely love it. It works really well with Context, and customizing Skinr, I can't think of a better system that I have used.

Using Panels however, I have found a challenge if you want to rigidly stick to the 960 grid framework (which I do.) The challenge is that panel panes are given the class .inner, nested inside of a content area in a region that is also given a class of .inner. The .inner applied to the content area of the region then reduces the actual width of the grid when in a panel to 940 px, and those areas outside the grid are off by 10 px with what is in the panel. I initially thought the quick solve would just be to put grid16-16 in the canvas settings on the grid and set all column separation to 0, create a float-left class and then apply my grid classes and float left in single regions on the page. that seemed to fail with flying colors: the grid did go to the full width, but since the .inner class was applied to the region, the panel was shifted to the right, and the right 10 px cropped off.

Since the 10 px border is called in the region without knowing if other content is to be added above or below, that could cause problems with simply removing .inner class from regions in page.tpl.php While it's pretty easy to work around on a case by case basis (I just added a region for panels under content that dropped the .inner class) I thought it would be very beneficial to have a resolution so that the panels work flawlessly when classed out using the grid system with panels.

I'll keep thinking on this, but wanted to see if this has already been addressed by the community, or if I'm missing an easy universal solution.

Comments

jalneal’s picture

I should clarify - the above requires a mini-panel as well to move the panel page to a certain area. If you are building full pages with panels, you could use
.page.tpl.php and remove class .inner from your main region. I suppose if you were using panels all the time to build your pages you could just drop the .inner class. I am using contetxs alone for about 3/4 of the site pages, which is why I'm trying to preserve the ability to keep the 10 px margins on non-panel pages.

jalneal’s picture

Priority: Normal » Minor

Ok... I found another problem and I think I solved all of mine when I did this:

In panels, when i had several regions side by side, margins were not applied because the class .inner has margins of zero if nested under the id #content-content. since this was one level inside of content-inner (the one I originally had a problem with) I have just removed the inner class from page.tpl.php on the line for content-content in the main region.

In my local CSS, I then added:

/* Revise to add gutters for blocks in content region, removed from content-inner region */
#content-content .inner {
  margin-left: 10px;
  margin-right: 10px;
}

So far, everything seems to work beautifully now, even when combining contexts and panels. Curious if there is not a reason to change this in the base theme - I don't see initial implications from applying to my site, but I'm sure the maintainers are much more aware of any implications doing this.

aminalid’s picture

Thanks for sharing the solution, had the same issue while creating a fusion sub theme.

So far I only added the same margins for #content-inner-inner .title which is outside of #content-content in fusion_starter theme.
Everything else is working fine.

goody815’s picture

Assigned: Unassigned » goody815
Status: Active » Closed (works as designed)

closing this as there hasn't been any objections to the panels solution from jalneal #2 solution. please reopen if you are still having this issue in D6 acquia marina