I have created three column layout for my site's front page.

While creating this panel, on Layout designer, I divided these three columns as exactly 20, 60 and 20 by holding shift key.

This was fine. I saved the panel.

But when I get back to front page, I can see in firebug that content area is just 99%.

My page width is 990px. But right hand column never reaches to the end.

In firebug, 20% column now shows width as 19.8% and 60% middle column shows 59.4% width.

In short 19.8+59.4+19.8 adds to 99 and front page is looking little weird.

I have checked my theme's "main" area and its width is 100%, so no problem there.

Please see the attaced images.

Thanks!

CommentFileSizeAuthor
#1 untitled1.PNG20.57 KBsaurabhi
#1 untitled2.PNG18.4 KBsaurabhi

Comments

saurabhi’s picture

StatusFileSize
new18.4 KB
new20.57 KB

Images!

mrfelton’s picture

I have this problem too.

EDIT: see http://groups.drupal.org/node/19298

saurabhi’s picture

Merlinofchaos has said that "The chances of your layout breaking on IE with 99.9% are high."

Looks like a precautionary step. 'Prevention is better than cure' kind of thing. ;-)

So merlinofchaos, Can you please confirm that there isn't any solution for this, apart from creating our own layout?

Setting "main" area width as 101% solves my issue. Though it isn't perfect, the irregularities are negligible/acceptable.

Thanks!

merlinofchaos’s picture

Status: Active » Closed (works as designed)

hefox is correct. IE has serious bugs regarding width and float, and the only solution I've found is to lock things to 99%. This has had some minor side effects here and there, but it is what we have.

If you need better than that, you will have to design your own layouts, or we need to implement a flexible system that uses a more robust method.

Andrey Zakharov’s picture

Version: 6.x-3.3 » 6.x-3.9
Component: Display rendering » Code
Status: Closed (works as designed) » Needs work
Issue tags: +legacy

Why you make all suffer by unused IE6 support?

Why just not to use CSS hack:
panels\plugins\layouts\flexible\flexible.inc

      // Because we love IE so much, auto scale everything to 99%. This
      // means adding up the actual widths and then providing a multiplier
      // to each so that the total is 99%.
      $scale = $renderer->scale_base / $middle_total;
      foreach ($middle as $position => $id) {
        $class = "." . $renderer->base[$type] . "-$id";
        $ie_class = "* html ." . $renderer->base[$type] . "-$id";
        $css[$class] = array(
          'float' => 'left',
          'width' => number_format($renderer->settings['items'][$id]['width'], 4, '.', '') . "%",
        );
        $css[$ie_class] = array(
          'float' => 'left',
          'width' => number_format($renderer->settings['items'][$id]['width'] * $scale, 4, '.', '') . "%",
        );

works for me.

esmerel’s picture

Version: 6.x-3.9 » 6.x-3.3
Component: Code » Plugins - display renderers
Status: Needs work » Closed (fixed)
Issue tags: -legacy

Seriously? You reopened an issue and changed stuff around over a year later? Open a new issue.

esmerel’s picture

Status: Closed (fixed) » Closed (works as designed)
Andrey Zakharov’s picture

Version: 6.x-3.3 » 6.x-3.9
Status: Closed (works as designed) » Active

What the purpose to open same issue ticket? To close it as duplicate?

Issue is still here.

Andrey Zakharov’s picture

Status: Active » Closed (won't fix)

Found proper checkbox when editing reused layout in canvas settings:
Scale fluid widths for IE6

malbone’s picture

Issue summary: View changes

This should be re-opened for version 7 as well. I see this is an OLD "will not fix." The problem is, it should only be affecting the widths, if and when IE6 is the browser. But it doesn't do that, it affects the widths of panels regions even if you are in the latest version of Chrome or Firefox or Safari. Thats why it should be an open issue.