Loading ...
Sorry, an error occurred while loading the content.

Resize utility causes horizontal scroll bars and obscures its content.

Expand Messages
  • aniad
    I have a layout inside a resize utility which has only the bottom resize handle. The resize border seems to add just a little edge/padding around the layout
    Message 1 of 5 , Apr 1, 2008
    • 0 Attachment
      I have a layout inside a resize utility which has only the bottom
      resize handle. The resize border seems to add just a little
      edge/padding around the layout causing horizontal scroll bar to
      appear. How can I avoid this? The resize is rendered with
      'proxy:true' so when actually dragging the resize handle the right
      edge of the proxy is scrolled off the screen. Having the 'proxy:true'
      or 'false' does not seem to make any difference. The resize control
      also obscures the bottom pixels of the layout and, as mentioned,
      extends the width (thus the horizontal scroll bars). How do I fix this?

      BTW, whether it is layout, or tab control, or whatever, it doesn't
      matter. It seems any control rendered at full width inside the resize
      causes this behavior.

      Here is my very simplified code. Thank you,
      Ania.

      <script>

      var layout;
      var resize;

      var IE_QUIRKS = (YAHOO.env.ua.ie && document.compatMode == "BackCompat");

      // UNDERLAY/IFRAME SYNC REQUIRED
      var IE_SYNC = (YAHOO.env.ua.ie == 6 || (YAHOO.env.ua.ie == 7 &&
      IE_QUIRKS));

      function initLayout()
      {
      layout = new YAHOO.widget.Layout('layoutDiv',
      {
      height: 500,
      units: [
      { position: 'right', header: 'Right', height: 490, width:
      300, resize: true, gutter: '2px 5px', footer: 'Footer', collapse:
      true, scroll: false, body: 'right1', maxWidth: 1000 },
      { position: 'center', height: 490, scroll: false, resize:
      true, body: 'selector', gutter: '2px 5px', collapse: true,
      collapseSize: 50, maxWidth: 1000 }
      ]
      });

      layout.render();
      }

      function initResize()
      {
      resize = new YAHOO.util.Resize('layoutDiv', { handles: 'b', proxy:
      true});

      resize.on('resize', function(args) {
      var panelHeight = args.height;
      var headerHeight = (this.header == null ) ? 0 :
      this.header.offsetHeight; // Content + Padding + Border
      var bodyHeight = (panelHeight - headerHeight);
      var bodyContentHeight = (IE_QUIRKS) ? bodyHeight : bodyHeight;//
      - PANEL_BODY_PADDING;

      YAHOO.util.Dom.setStyle(this.body, 'height', bodyContentHeight +
      'px');

      if (IE_SYNC)
      {
      this.sizeUnderlay();
      this.syncIframe();
      }

      layout.set('height', bodyContentHeight);
      layout.resize();

      });
      }

      YAHOO.util.Event.onDOMReady(initLayout);
      YAHOO.util.Event.onDOMReady(initResize);

      </script>

      <body class=" yui-skin-sam">
      <div id="layoutDiv" height="100%" width="100%"></div>
      <div id="right1">I'm right side</div>
      <div id="selector">I'm center</div>
      Some stuff.
      <script>

      (function() {
      var Dom = YAHOO.util.Dom,
      Event = YAHOO.util.Event;
      });

      </script>
      </body>
    • Dav Glass
      Ania -- It s not really cutting it off, it s that the CSS for the handle has a background color on it, so it appears to cut it off.. .yui-skin-sam .yui-resize
      Message 2 of 5 , Apr 1, 2008
      • 0 Attachment
        Ania --

        It's not really cutting it off, it's that the CSS for the handle has a background color on it, so it appears to cut it off..

        .yui-skin-sam .yui-resize .yui-resize-handle {
        background-color: transparent;
        }

        That will remove the color from the handle so you can see the layout.

        You can also adjust the size and position of the handle via CSS with this rule:

        .yui-skin-sam .yui-resize .yui-resize-handle-b {
        width: 98%;
        }

        Does that help?
        Dav

        Dav Glass
        dav.glass@...
        blog.davglass.com




        + Windows: n. - The most successful computer virus, ever. +
        + A computer without a Microsoft operating system is like a dog
        without bricks tied to its head +
        + A Microsoft Certified Systems Engineer is to computing what a
        McDonalds Certified Food Specialist is to fine cuisine +


        ----- Original Message ----
        From: aniad <aniad@...>
        To: ydn-javascript@yahoogroups.com
        Sent: Tuesday, April 1, 2008 11:45:29 AM
        Subject: [ydn-javascript] Resize utility causes horizontal scroll bars and obscures its content.

        I have a layout inside a resize utility which has only the bottom
        resize handle. The resize border seems to add just a little
        edge/padding around the layout causing horizontal scroll bar to
        appear. How can I avoid this? The resize is rendered with
        'proxy:true' so when actually dragging the resize handle the right
        edge of the proxy is scrolled off the screen. Having the 'proxy:true'
        or 'false' does not seem to make any difference. The resize control
        also obscures the bottom pixels of the layout and, as mentioned,
        extends the width (thus the horizontal scroll bars). How do I fix this?

        BTW, whether it is layout, or tab control, or whatever, it doesn't
        matter. It seems any control rendered at full width inside the resize
        causes this behavior.

        Here is my very simplified code. Thank you,
        Ania.

        <script>

        var layout;
        var resize;

        var IE_QUIRKS = (YAHOO.env.ua.ie && document.compatMode == "BackCompat");

        // UNDERLAY/IFRAME SYNC REQUIRED
        var IE_SYNC = (YAHOO.env.ua.ie == 6 || (YAHOO.env.ua.ie == 7 &&
        IE_QUIRKS));

        function initLayout()
        {
        layout = new YAHOO.widget.Layout('layoutDiv',
        {
        height: 500,
        units: [
        { position: 'right', header: 'Right', height: 490, width:
        300, resize: true, gutter: '2px 5px', footer: 'Footer', collapse:
        true, scroll: false, body: 'right1', maxWidth: 1000 },
        { position: 'center', height: 490, scroll: false, resize:
        true, body: 'selector', gutter: '2px 5px', collapse: true,
        collapseSize: 50, maxWidth: 1000 }
        ]
        });

        layout.render();
        }

        function initResize()
        {
        resize = new YAHOO.util.Resize('layoutDiv', { handles: 'b', proxy:
        true});

        resize.on('resize', function(args) {
        var panelHeight = args.height;
        var headerHeight = (this.header == null ) ? 0 :
        this.header.offsetHeight; // Content + Padding + Border
        var bodyHeight = (panelHeight - headerHeight);
        var bodyContentHeight = (IE_QUIRKS) ? bodyHeight : bodyHeight;//
        - PANEL_BODY_PADDING;

        YAHOO.util.Dom.setStyle(this.body, 'height', bodyContentHeight +
        'px');

        if (IE_SYNC)
        {
        this.sizeUnderlay();
        this.syncIframe();
        }

        layout.set('height', bodyContentHeight);
        layout.resize();

        });
        }

        YAHOO.util.Event.onDOMReady(initLayout);
        YAHOO.util.Event.onDOMReady(initResize);

        </script>

        <body class=" yui-skin-sam">
        <div id="layoutDiv" height="100%" width="100%"></div>
        <div id="right1">I'm right side</div>
        <div id="selector">I'm center</div>
        Some stuff.
        <script>

        (function() {
        var Dom = YAHOO.util.Dom,
        Event = YAHOO.util.Event;
        });

        </script>
        </body>



        ------------------------------------

        Yahoo! Groups Links
      • aniad
        Thank you, it partly helped. The transparent style indeed took care of obscuring part of the layout. However, in terms of the scroll bar, it didn t. It is
        Message 3 of 5 , Apr 2, 2008
        • 0 Attachment
          Thank you, it partly helped. The 'transparent' style indeed took care
          of obscuring part of the layout.

          However, in terms of the scroll bar, it didn't. It is not the size or
          position of the resize handle that is the problem. But the fact that
          creating the resize causes horizontal scrollbar to appear, sometimes
          the vertical one also comes in and out.

          If I comment out the creation of the resize utility, the layout
          renders fine, and there are no scroll bars. Creating the resize around
          the layout causes at least the horizontal scroll bar. The layout
          "bleeds" horizontally outside of the resize.

          a.

          --- In ydn-javascript@yahoogroups.com, Dav Glass <dav.glass@...> wrote:
          >
          > Ania --
          >
          > It's not really cutting it off, it's that the CSS for the handle has
          a background color on it, so it appears to cut it off..
          >
          > .yui-skin-sam .yui-resize .yui-resize-handle {
          > background-color: transparent;
          > }
          >
          > That will remove the color from the handle so you can see the layout.
          >
          > You can also adjust the size and position of the handle via CSS with
          this rule:
          >
          > .yui-skin-sam .yui-resize .yui-resize-handle-b {
          > width: 98%;
          > }
          >
          > Does that help?
          > Dav
          >
          > Dav Glass
          > dav.glass@...
          > blog.davglass.com
          >
          >
          >
          >
          > + Windows: n. - The most successful computer virus, ever. +
          > + A computer without a Microsoft operating system is like a dog
          > without bricks tied to its head +
          > + A Microsoft Certified Systems Engineer is to computing what a
          > McDonalds Certified Food Specialist is to fine cuisine +
          >
          >
          > ----- Original Message ----
          > From: aniad <aniad@...>
          > To: ydn-javascript@yahoogroups.com
          > Sent: Tuesday, April 1, 2008 11:45:29 AM
          > Subject: [ydn-javascript] Resize utility causes horizontal scroll
          bars and obscures its content.
          >
          > I have a layout inside a resize utility which has only the bottom
          > resize handle. The resize border seems to add just a little
          > edge/padding around the layout causing horizontal scroll bar to
          > appear. How can I avoid this? The resize is rendered with
          > 'proxy:true' so when actually dragging the resize handle the right
          > edge of the proxy is scrolled off the screen. Having the 'proxy:true'
          > or 'false' does not seem to make any difference. The resize control
          > also obscures the bottom pixels of the layout and, as mentioned,
          > extends the width (thus the horizontal scroll bars). How do I fix this?
          >
          > BTW, whether it is layout, or tab control, or whatever, it doesn't
          > matter. It seems any control rendered at full width inside the resize
          > causes this behavior.
          >
          > Here is my very simplified code. Thank you,
          > Ania.
          >
          > <script>
          >
          > var layout;
          > var resize;
          >
          > var IE_QUIRKS = (YAHOO.env.ua.ie && document.compatMode ==
          "BackCompat");
          >
          > // UNDERLAY/IFRAME SYNC REQUIRED
          > var IE_SYNC = (YAHOO.env.ua.ie == 6 || (YAHOO.env.ua.ie == 7 &&
          > IE_QUIRKS));
          >
          > function initLayout()
          > {
          > layout = new YAHOO.widget.Layout('layoutDiv',
          > {
          > height: 500,
          > units: [
          > { position: 'right', header: 'Right', height: 490, width:
          > 300, resize: true, gutter: '2px 5px', footer: 'Footer', collapse:
          > true, scroll: false, body: 'right1', maxWidth: 1000 },
          > { position: 'center', height: 490, scroll: false, resize:
          > true, body: 'selector', gutter: '2px 5px', collapse: true,
          > collapseSize: 50, maxWidth: 1000 }
          > ]
          > });
          >
          > layout.render();
          > }
          >
          > function initResize()
          > {
          > resize = new YAHOO.util.Resize('layoutDiv', { handles: 'b', proxy:
          > true});
          >
          > resize.on('resize', function(args) {
          > var panelHeight = args.height;
          > var headerHeight = (this.header == null ) ? 0 :
          > this.header.offsetHeight; // Content + Padding + Border
          > var bodyHeight = (panelHeight - headerHeight);
          > var bodyContentHeight = (IE_QUIRKS) ? bodyHeight : bodyHeight;//
          > - PANEL_BODY_PADDING;
          >
          > YAHOO.util.Dom.setStyle(this.body, 'height', bodyContentHeight +
          > 'px');
          >
          > if (IE_SYNC)
          > {
          > this.sizeUnderlay();
          > this.syncIframe();
          > }
          >
          > layout.set('height', bodyContentHeight);
          > layout.resize();
          >
          > });
          > }
          >
          > YAHOO.util.Event.onDOMReady(initLayout);
          > YAHOO.util.Event.onDOMReady(initResize);
          >
          > </script>
          >
          > <body class=" yui-skin-sam">
          > <div id="layoutDiv" height="100%" width="100%"></div>
          > <div id="right1">I'm right side</div>
          > <div id="selector">I'm center</div>
          > Some stuff.
          > <script>
          >
          > (function() {
          > var Dom = YAHOO.util.Dom,
          > Event = YAHOO.util.Event;
          > });
          >
          > </script>
          > </body>
          >
          >
          >
          > ------------------------------------
          >
          > Yahoo! Groups Links
          >
        • Dav Glass
          aniad -- Your best bet is to not put the Resize on the Layout div, you should put the resize on an outer element.. Let me see about making you an example later
          Message 4 of 5 , Apr 2, 2008
          • 0 Attachment
            aniad --

            Your best bet is to not put the Resize on the Layout div, you should put the resize on an outer element..

            Let me see about making you an example later this afternoon..

            Dav

            Dav Glass
            dav.glass@...
            blog.davglass.com




            + Windows: n. - The most successful computer virus, ever. +
            + A computer without a Microsoft operating system is like a dog
            without bricks tied to its head +
            + A Microsoft Certified Systems Engineer is to computing what a
            McDonalds Certified Food Specialist is to fine cuisine +


            ----- Original Message ----
            From: aniad <aniad@...>
            To: ydn-javascript@yahoogroups.com
            Sent: Wednesday, April 2, 2008 1:11:52 PM
            Subject: [ydn-javascript] Re: Resize utility causes horizontal scroll bars and obscures its content.

            Thank you, it partly helped. The 'transparent' style indeed took care
            of obscuring part of the layout.

            However, in terms of the scroll bar, it didn't. It is not the size or
            position of the resize handle that is the problem. But the fact that
            creating the resize causes horizontal scrollbar to appear, sometimes
            the vertical one also comes in and out.

            If I comment out the creation of the resize utility, the layout
            renders fine, and there are no scroll bars. Creating the resize around
            the layout causes at least the horizontal scroll bar. The layout
            "bleeds" horizontally outside of the resize.

            a.

            --- In ydn-javascript@yahoogroups.com, Dav Glass <dav.glass@...> wrote:
            >
            > Ania --
            >
            > It's not really cutting it off, it's that the CSS for the handle has
            a background color on it, so it appears to cut it off..
            >
            > .yui-skin-sam .yui-resize .yui-resize-handle {
            > background-color: transparent;
            > }
            >
            > That will remove the color from the handle so you can see the layout.
            >
            > You can also adjust the size and position of the handle via CSS with
            this rule:
            >
            > .yui-skin-sam .yui-resize .yui-resize-handle-b {
            > width: 98%;
            > }
            >
            > Does that help?
            > Dav
            >
            > Dav Glass
            > dav.glass@...
            > blog.davglass.com
            >
            >
            >
            >
            > + Windows: n. - The most successful computer virus, ever. +
            > + A computer without a Microsoft operating system is like a dog
            > without bricks tied to its head +
            > + A Microsoft Certified Systems Engineer is to computing what a
            > McDonalds Certified Food Specialist is to fine cuisine +
            >
            >
            > ----- Original Message ----
            > From: aniad <aniad@...>
            > To: ydn-javascript@yahoogroups.com
            > Sent: Tuesday, April 1, 2008 11:45:29 AM
            > Subject: [ydn-javascript] Resize utility causes horizontal scroll
            bars and obscures its content.
            >
            > I have a layout inside a resize utility which has only the bottom
            > resize handle. The resize border seems to add just a little
            > edge/padding around the layout causing horizontal scroll bar to
            > appear. How can I avoid this? The resize is rendered with
            > 'proxy:true' so when actually dragging the resize handle the right
            > edge of the proxy is scrolled off the screen. Having the 'proxy:true'
            > or 'false' does not seem to make any difference. The resize control
            > also obscures the bottom pixels of the layout and, as mentioned,
            > extends the width (thus the horizontal scroll bars). How do I fix this?
            >
            > BTW, whether it is layout, or tab control, or whatever, it doesn't
            > matter. It seems any control rendered at full width inside the resize
            > causes this behavior.
            >
            > Here is my very simplified code. Thank you,
            > Ania.
            >
            > <script>
            >
            > var layout;
            > var resize;
            >
            > var IE_QUIRKS = (YAHOO.env.ua.ie && document.compatMode ==
            "BackCompat");
            >
            > // UNDERLAY/IFRAME SYNC REQUIRED
            > var IE_SYNC = (YAHOO.env.ua.ie == 6 || (YAHOO.env.ua.ie == 7 &&
            > IE_QUIRKS));
            >
            > function initLayout()
            > {
            > layout = new YAHOO.widget.Layout('layoutDiv',
            > {
            > height: 500,
            > units: [
            > { position: 'right', header: 'Right', height: 490, width:
            > 300, resize: true, gutter: '2px 5px', footer: 'Footer', collapse:
            > true, scroll: false, body: 'right1', maxWidth: 1000 },
            > { position: 'center', height: 490, scroll: false, resize:
            > true, body: 'selector', gutter: '2px 5px', collapse: true,
            > collapseSize: 50, maxWidth: 1000 }
            > ]
            > });
            >
            > layout.render();
            > }
            >
            > function initResize()
            > {
            > resize = new YAHOO.util.Resize('layoutDiv', { handles: 'b', proxy:
            > true});
            >
            > resize.on('resize', function(args) {
            > var panelHeight = args.height;
            > var headerHeight = (this.header == null ) ? 0 :
            > this.header.offsetHeight; // Content + Padding + Border
            > var bodyHeight = (panelHeight - headerHeight);
            > var bodyContentHeight = (IE_QUIRKS) ? bodyHeight : bodyHeight;//
            > - PANEL_BODY_PADDING;
            >
            > YAHOO.util.Dom.setStyle(this.body, 'height', bodyContentHeight +
            > 'px');
            >
            > if (IE_SYNC)
            > {
            > this.sizeUnderlay();
            > this.syncIframe();
            > }
            >
            > layout.set('height', bodyContentHeight);
            > layout.resize();
            >
            > });
            > }
            >
            > YAHOO.util.Event.onDOMReady(initLayout);
            > YAHOO.util.Event.onDOMReady(initResize);
            >
            > </script>
            >
            > <body class=" yui-skin-sam">
            > <div id="layoutDiv" height="100%" width="100%"></div>
            > <div id="right1">I'm right side</div>
            > <div id="selector">I'm center</div>
            > Some stuff.
            > <script>
            >
            > (function() {
            > var Dom = YAHOO.util.Dom,
            > Event = YAHOO.util.Event;
            > });
            >
            > </script>
            > </body>
            >
            >
            >
            > ------------------------------------
            >
            > Yahoo! Groups Links
            >



            ------------------------------------

            Yahoo! Groups Links
          • aniad
            That would be great! I tried playing with styles but cannot get consistent rendering in firefox vs. ie. Whatever i try i get some peculiar behavior with
            Message 5 of 5 , Apr 3, 2008
            • 0 Attachment
              That would be great!
              I tried playing with styles but cannot get consistent rendering in
              firefox vs. ie. Whatever i try i get some peculiar behavior with
              scroll bars attributable to the resize utility.
              Thanks again,
              Ania.

              --- In ydn-javascript@yahoogroups.com, Dav Glass <dav.glass@...> wrote:
              >
              > aniad --
              >
              > Your best bet is to not put the Resize on the Layout div, you should
              put the resize on an outer element..
              >
              > Let me see about making you an example later this afternoon..
              >
              > Dav
              >
              > Dav Glass
              > dav.glass@...
              > blog.davglass.com
              >
              >
              >
              >
              > + Windows: n. - The most successful computer virus, ever. +
              > + A computer without a Microsoft operating system is like a dog
              > without bricks tied to its head +
              > + A Microsoft Certified Systems Engineer is to computing what a
              > McDonalds Certified Food Specialist is to fine cuisine +
              >
              >
              > ----- Original Message ----
              > From: aniad <aniad@...>
              > To: ydn-javascript@yahoogroups.com
              > Sent: Wednesday, April 2, 2008 1:11:52 PM
              > Subject: [ydn-javascript] Re: Resize utility causes horizontal
              scroll bars and obscures its content.
              >
              > Thank you, it partly helped. The 'transparent' style indeed took care
              > of obscuring part of the layout.
              >
              > However, in terms of the scroll bar, it didn't. It is not the size or
              > position of the resize handle that is the problem. But the fact that
              > creating the resize causes horizontal scrollbar to appear, sometimes
              > the vertical one also comes in and out.
              >
              > If I comment out the creation of the resize utility, the layout
              > renders fine, and there are no scroll bars. Creating the resize around
              > the layout causes at least the horizontal scroll bar. The layout
              > "bleeds" horizontally outside of the resize.
              >
              > a.
              >
              > --- In ydn-javascript@yahoogroups.com, Dav Glass <dav.glass@> wrote:
              > >
              > > Ania --
              > >
              > > It's not really cutting it off, it's that the CSS for the handle has
              > a background color on it, so it appears to cut it off..
              > >
              > > .yui-skin-sam .yui-resize .yui-resize-handle {
              > > background-color: transparent;
              > > }
              > >
              > > That will remove the color from the handle so you can see the layout.
              > >
              > > You can also adjust the size and position of the handle via CSS with
              > this rule:
              > >
              > > .yui-skin-sam .yui-resize .yui-resize-handle-b {
              > > width: 98%;
              > > }
              > >
              > > Does that help?
              > > Dav
              > >
              > > Dav Glass
              > > dav.glass@
              > > blog.davglass.com
              > >
              > >
              > >
              > >
              > > + Windows: n. - The most successful computer virus, ever. +
              > > + A computer without a Microsoft operating system is like a dog
              > > without bricks tied to its head +
              > > + A Microsoft Certified Systems Engineer is to computing what a
              > > McDonalds Certified Food Specialist is to fine cuisine +
              > >
              > >
              > > ----- Original Message ----
              > > From: aniad <aniad@>
              > > To: ydn-javascript@yahoogroups.com
              > > Sent: Tuesday, April 1, 2008 11:45:29 AM
              > > Subject: [ydn-javascript] Resize utility causes horizontal scroll
              > bars and obscures its content.
              > >
              > > I have a layout inside a resize utility which has only the bottom
              > > resize handle. The resize border seems to add just a little
              > > edge/padding around the layout causing horizontal scroll bar to
              > > appear. How can I avoid this? The resize is rendered with
              > > 'proxy:true' so when actually dragging the resize handle the right
              > > edge of the proxy is scrolled off the screen. Having the 'proxy:true'
              > > or 'false' does not seem to make any difference. The resize control
              > > also obscures the bottom pixels of the layout and, as mentioned,
              > > extends the width (thus the horizontal scroll bars). How do I fix
              this?
              > >
              > > BTW, whether it is layout, or tab control, or whatever, it doesn't
              > > matter. It seems any control rendered at full width inside the resize
              > > causes this behavior.
              > >
              > > Here is my very simplified code. Thank you,
              > > Ania.
              > >
              > > <script>
              > >
              > > var layout;
              > > var resize;
              > >
              > > var IE_QUIRKS = (YAHOO.env.ua.ie && document.compatMode ==
              > "BackCompat");
              > >
              > > // UNDERLAY/IFRAME SYNC REQUIRED
              > > var IE_SYNC = (YAHOO.env.ua.ie == 6 || (YAHOO.env.ua.ie == 7 &&
              > > IE_QUIRKS));
              > >
              > > function initLayout()
              > > {
              > > layout = new YAHOO.widget.Layout('layoutDiv',
              > > {
              > > height: 500,
              > > units: [
              > > { position: 'right', header: 'Right', height: 490, width:
              > > 300, resize: true, gutter: '2px 5px', footer: 'Footer', collapse:
              > > true, scroll: false, body: 'right1', maxWidth: 1000 },
              > > { position: 'center', height: 490, scroll: false, resize:
              > > true, body: 'selector', gutter: '2px 5px', collapse: true,
              > > collapseSize: 50, maxWidth: 1000 }
              > > ]
              > > });
              > >
              > > layout.render();
              > > }
              > >
              > > function initResize()
              > > {
              > > resize = new YAHOO.util.Resize('layoutDiv', { handles: 'b', proxy:
              > > true});
              > >
              > > resize.on('resize', function(args) {
              > > var panelHeight = args.height;
              > > var headerHeight = (this.header == null ) ? 0 :
              > > this.header.offsetHeight; // Content + Padding + Border
              > > var bodyHeight = (panelHeight - headerHeight);
              > > var bodyContentHeight = (IE_QUIRKS) ? bodyHeight : bodyHeight;//
              > > - PANEL_BODY_PADDING;
              > >
              > > YAHOO.util.Dom.setStyle(this.body, 'height', bodyContentHeight +
              > > 'px');
              > >
              > > if (IE_SYNC)
              > > {
              > > this.sizeUnderlay();
              > > this.syncIframe();
              > > }
              > >
              > > layout.set('height', bodyContentHeight);
              > > layout.resize();
              > >
              > > });
              > > }
              > >
              > > YAHOO.util.Event.onDOMReady(initLayout);
              > > YAHOO.util.Event.onDOMReady(initResize);
              > >
              > > </script>
              > >
              > > <body class=" yui-skin-sam">
              > > <div id="layoutDiv" height="100%" width="100%"></div>
              > > <div id="right1">I'm right side</div>
              > > <div id="selector">I'm center</div>
              > > Some stuff.
              > > <script>
              > >
              > > (function() {
              > > var Dom = YAHOO.util.Dom,
              > > Event = YAHOO.util.Event;
              > > });
              > >
              > > </script>
              > > </body>
              > >
              > >
              > >
              > > ------------------------------------
              > >
              > > Yahoo! Groups Links
              > >
              >
              >
              >
              > ------------------------------------
              >
              > Yahoo! Groups Links
              >
            Your message has been successfully submitted and would be delivered to recipients shortly.