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

Re: can anyone tell me why this grid doesn't render properly?

Expand Messages
  • juliebonniedaisy
    oh great grids master make thyself known ! We bring you grids of joy.
    Message 1 of 14 , Nov 3, 2009
    • 0 Attachment
      oh great grids master make thyself known ! We bring you grids of joy.

      --- In ydn-javascript@yahoogroups.com, "juliebonniedaisy" <juliebonniedaisy@...> wrote:
      >
      > It is supposed to be 2/3 - 1/3
      > inside the 2/3, divided into 3
      > inside the 1/3, divided into 2/3 - 1/3
      > Thanks !
      >
      >
      > <div id="doc2">
      >
      > <div id="bd">
      >
      > <div class="yui-gc">
      > <div class="yui-gb first">
      > <div class="yui-u first">col 1.a</div>
      > <div class="yui-u">col 1.b</div>
      > <div class="yui-u">col 1.c</div>
      > </div>
      > <div class="yui-gc">
      > <div class="yui-u first">col 2.a</div>
      > <div class="yui-u">col 2.b</div>
      > </div>
      > </div>
      > </div>
      > </div>
      >
    • Matt Sweeney
      Hi Julie, Your grid markup is incomplete. The yui-main id wrapper is required around the content grid. The content block inside of yui-main requires the
      Message 2 of 14 , Nov 3, 2009
      • 0 Attachment
        Hi Julie,

        Your grid markup is incomplete. The "yui-main" id wrapper is required
        around the content grid. The content block inside of yui-main requires
        the "yui-b" class wrapper.

        ...
        <div id="yui-main">
        <div class="yui-b">
        <div class="yui-gc">
        <div class="yui-gb first">
        <div class="yui-u first">col 1.a</div>
        <div class="yui-u">col 1.b</div>
        <div class="yui-u">col 1.c</div>
        </div>
        <div class="yui-gc">
        <div class="yui-u first">col 2.a</div>
        <div class="yui-u">col 2.b</div>
        </div>
        </div>
        </div>
        </div>
        </div>
        ...

        I recommend starting with the Grid Builder[1] to get the basic template
        together before nesting grids.

        -Matt

        [1] http://developer.yahoo.com/yui/grids/builder/

        juliebonniedaisy wrote:
        > It is supposed to be 2/3 - 1/3
        > inside the 2/3, divided into 3
        > inside the 1/3, divided into 2/3 - 1/3
        > Thanks !
        >
        >
        > <div id="doc2">
        >
        > <div id="bd">
        >
        > <div class="yui-gc">
        > <div class="yui-gb first">
        > <div class="yui-u first">col 1.a</div>
        > <div class="yui-u">col 1.b</div>
        > <div class="yui-u">col 1.c</div>
        > </div>
        > <div class="yui-gc">
        > <div class="yui-u first">col 2.a</div>
        > <div class="yui-u">col 2.b</div>
        > </div>
        > </div>
        > </div>
        > </div>
        >
        >
      • juliebonniedaisy
        Thank you for the reply. I have used the grid builder many times and i notice it does not include yui-main in the code it generates. Here is my latest
        Message 3 of 14 , Nov 4, 2009
        • 0 Attachment
          Thank you for the reply. I have used the grid builder many times and i notice it does not include yui-main in the code it generates. Here is my latest attempt based on your example but i'm finding col 1.c is going to the next line and col 2.a and b go on a third line.

          Everything should stay on the same line though.

          <body class="yui-skin-sam main">

          <div id="doc3">

          <div id="bd">
          <div id="yui-main"> <!-- primary content -->
          <div class="yui-b"> <!-- basic block -->
          <div class="yui-gc"> <!-- 2/3 - 1/3 -->
          <div class="yui-gb first"> <!-- 1/3 - 1/3 - 1/3 -->
          <div class="yui-u first">col 1.a</div> <!-- first unit -->
          <div class="yui-u">col 1.b</div> <!-- unit -->
          <div class="yui-u">col 1.c</div> <!-- unit -->
          </div>
          <div class="yui-gc"> <!-- 2/3 - 1/3 -->
          <div class="yui-u first">col 2.a</div> <!-- first unit -->
          <div class="yui-u">col 2.b</div> <!-- unit -->
          </div>
          </div>
          </div>
          </div>
          </div>


          </div>


          </body>
        • Christian Tiberg
          What finally got how this worked into my head is the 960 grid system. Their simple image said it all, and the code was easy to read. But I don t copy it
          Message 4 of 14 , Nov 4, 2009
          • 0 Attachment
            What finally got how this worked into my head is the 960 grid system. Their simple image said it all, and the code was easy to read. But I don't copy it verbatim, now I know enough to write my own :)


            Best regards,
             Christian Tiberg


            2009/11/4 juliebonniedaisy <juliebonniedaisy@...>
             

            Thank you for the reply. I have used the grid builder many times and i notice it does not include yui-main in the code it generates. Here is my latest attempt based on your example but i'm finding col 1.c is going to the next line and col 2.a and b go on a third line.

            Everything should stay on the same line though.

            <body class="yui-skin-sam main">

            <div id="doc3">

            <div id="bd">
            <div id="yui-main"> <!-- primary content -->
            <div class="yui-b"> <!-- basic block -->
            <div class="yui-gc"> <!-- 2/3 - 1/3 -->
            <div class="yui-gb first"> <!-- 1/3 - 1/3 - 1/3 -->
            <div class="yui-u first">col 1.a</div> <!-- first unit -->
            <div class="yui-u">col 1.b</div> <!-- unit -->
            <div class="yui-u">col 1.c</div> <!-- unit -->
            </div>
            <div class="yui-gc"> <!-- 2/3 - 1/3 -->
            <div class="yui-u first">col 2.a</div> <!-- first unit -->
            <div class="yui-u">col 2.b</div> <!-- unit -->


            </div>
            </div>
            </div>
            </div>
            </div>


            </div>

            </body>


          • juliebonniedaisy
            surely it s not necessary to learn an entirely different grid system to make this one work. lets not over complicate it please. if you see the problem
            Message 5 of 14 , Nov 4, 2009
            • 0 Attachment
              surely it's not necessary to learn an entirely different grid system to make this one work. lets not over complicate it please. if you see the problem please let me know.

              Regards...

              --- In ydn-javascript@yahoogroups.com, Christian Tiberg <ctiberg@...> wrote:
              >
              > What finally got how this worked into my head is the 960 grid system. Their
              > simple image said it all, and the code was easy to read. But I don't copy it
              > verbatim, now I know enough to write my own :)
              >
              > http://960.gs/
              >
              > Best regards,
              > Christian Tiberg
              >
              >
              > 2009/11/4 juliebonniedaisy <juliebonniedaisy@...>
              >
              > >
              > >
              > > Thank you for the reply. I have used the grid builder many times and i
              > > notice it does not include yui-main in the code it generates. Here is my
              > > latest attempt based on your example but i'm finding col 1.c is going to the
              > > next line and col 2.a and b go on a third line.
              > >
              > > Everything should stay on the same line though.
              > >
              > > <body class="yui-skin-sam main">
              > >
              > > <div id="doc3">
              > >
              > > <div id="bd">
              > > <div id="yui-main"> <!-- primary content -->
              > > <div class="yui-b"> <!-- basic block -->
              > > <div class="yui-gc"> <!-- 2/3 - 1/3 -->
              > > <div class="yui-gb first"> <!-- 1/3 - 1/3 - 1/3 -->
              > > <div class="yui-u first">col 1.a</div> <!-- first unit -->
              > > <div class="yui-u">col 1.b</div> <!-- unit -->
              > > <div class="yui-u">col 1.c</div> <!-- unit -->
              > > </div>
              > > <div class="yui-gc"> <!-- 2/3 - 1/3 -->
              > > <div class="yui-u first">col 2.a</div> <!-- first unit -->
              > > <div class="yui-u">col 2.b</div> <!-- unit -->
              > >
              > > </div>
              > > </div>
              > > </div>
              > > </div>
              > > </div>
              > >
              > >
              > > </div>
              > >
              > > </body>
              > >
              > >
              > >
              >
            • Matt Sweeney
              Hi Julie, The issue is with the cascading rules. The units are incorrectly inheriting the -gc rather than -gb. Adding the following to your stylesheet should
              Message 6 of 14 , Nov 4, 2009
              • 0 Attachment
                Hi Julie,

                The issue is with the cascading rules. The units are incorrectly
                inheriting the -gc rather than -gb.

                Adding the following to your stylesheet should resolve it:
                .yui-gc .yui-gb .yui-u {
                float: left;
                width: 32%;
                }


                I double-checked the grid builder, and it does include the full markup
                template, including the "yui-main" div, but that isn't the issue here.
                This is exactly the type of issue I am resolving with the updated yui3
                grids.

                Sorry about the hassle.

                -Matt

                juliebonniedaisy wrote:
                > Thank you for the reply. I have used the grid builder many times and i notice it does not include yui-main in the code it generates. Here is my latest attempt based on your example but i'm finding col 1.c is going to the next line and col 2.a and b go on a third line.
                >
                > Everything should stay on the same line though.
                >
                > <body class="yui-skin-sam main">
                >
                > <div id="doc3">
                >
                > <div id="bd">
                > <div id="yui-main"> <!-- primary content -->
                > <div class="yui-b"> <!-- basic block -->
                > <div class="yui-gc"> <!-- 2/3 - 1/3 -->
                > <div class="yui-gb first"> <!-- 1/3 - 1/3 - 1/3 -->
                > <div class="yui-u first">col 1.a</div> <!-- first unit -->
                > <div class="yui-u">col 1.b</div> <!-- unit -->
                > <div class="yui-u">col 1.c</div> <!-- unit -->
                > </div>
                > <div class="yui-gc"> <!-- 2/3 - 1/3 -->
                > <div class="yui-u first">col 2.a</div> <!-- first unit -->
                > <div class="yui-u">col 2.b</div> <!-- unit -->
                > </div>
                > </div>
                > </div>
                > </div>
                > </div>
                >
                >
                > </div>
                >
                >
                > </body>
                >
                >
                >
                >
              • Christian Tiberg
                Sure, do it your way :) It was just a friendly note. I didn t learn that system at all, and I m not using the YUI grids system either. I simply learned enough
                Message 7 of 14 , Nov 4, 2009
                • 0 Attachment
                  Sure, do it your way :) It was just a friendly note. I didn't learn that system at all, and I'm not using the YUI grids system either. I simply learned enough CSS to roll my own.

                  The only thing I needed was to realize that setting float: none, display:inline on a div makes it work.

                  Best regards,
                   Christian Tiberg


                  2009/11/5 Matt Sweeney <msweeney@...>
                   

                  Hi Julie,

                  The issue is with the cascading rules. The units are incorrectly
                  inheriting the -gc rather than -gb.

                  Adding the following to your stylesheet should resolve it:
                  .yui-gc .yui-gb .yui-u {
                  float: left;
                  width: 32%;
                  }

                  I double-checked the grid builder, and it does include the full markup
                  template, including the "yui-main" div, but that isn't the issue here.
                  This is exactly the type of issue I am resolving with the updated yui3
                  grids.

                  Sorry about the hassle.

                  -Matt



                  juliebonniedaisy wrote:
                  > Thank you for the reply. I have used the grid builder many times and i notice it does not include yui-main in the code it generates. Here is my latest attempt based on your example but i'm finding col 1.c is going to the next line and col 2.a and b go on a third line.
                  >
                  > Everything should stay on the same line though.
                  >
                  > <body class="yui-skin-sam main">
                  >
                  > <div id="doc3">
                  >
                  > <div id="bd">
                  > <div id="yui-main"> <!-- primary content -->
                  > <div class="yui-b"> <!-- basic block -->
                  > <div class="yui-gc"> <!-- 2/3 - 1/3 -->
                  > <div class="yui-gb first"> <!-- 1/3 - 1/3 - 1/3 -->
                  > <div class="yui-u first">col 1.a</div> <!-- first unit -->
                  > <div class="yui-u">col 1.b</div> <!-- unit -->
                  > <div class="yui-u">col 1.c</div> <!-- unit -->
                  > </div>
                  > <div class="yui-gc"> <!-- 2/3 - 1/3 -->
                  > <div class="yui-u first">col 2.a</div> <!-- first unit -->
                  > <div class="yui-u">col 2.b</div> <!-- unit -->
                  > </div>
                  > </div>
                  > </div>
                  > </div>
                  > </div>
                  >
                  >
                  > </div>
                  >
                  >
                  > </body>
                  >
                  >
                  >
                  >


                • juliebonniedaisy
                  Thanks for the reply but the 2nd section(yui-gc) is still going to the 2nd line. Any ideas?
                  Message 8 of 14 , Nov 5, 2009
                  • 0 Attachment
                    Thanks for the reply but the 2nd section(yui-gc) is still going to the 2nd line. Any ideas?

                    --- In ydn-javascript@yahoogroups.com, Matt Sweeney <msweeney@...> wrote:
                    >
                    > Hi Julie,
                    >
                    > The issue is with the cascading rules. The units are incorrectly
                    > inheriting the -gc rather than -gb.
                    >
                    > Adding the following to your stylesheet should resolve it:
                    > .yui-gc .yui-gb .yui-u {
                    > float: left;
                    > width: 32%;
                    > }
                    >
                    >
                    > I double-checked the grid builder, and it does include the full markup
                    > template, including the "yui-main" div, but that isn't the issue here.
                    > This is exactly the type of issue I am resolving with the updated yui3
                    > grids.
                    >
                    > Sorry about the hassle.
                    >
                    > -Matt
                    >
                    > juliebonniedaisy wrote:
                    > > Thank you for the reply. I have used the grid builder many times and i notice it does not include yui-main in the code it generates. Here is my latest attempt based on your example but i'm finding col 1.c is going to the next line and col 2.a and b go on a third line.
                    > >
                    > > Everything should stay on the same line though.
                    > >
                    > > <body class="yui-skin-sam main">
                    > >
                    > > <div id="doc3">
                    > >
                    > > <div id="bd">
                    > > <div id="yui-main"> <!-- primary content -->
                    > > <div class="yui-b"> <!-- basic block -->
                    > > <div class="yui-gc"> <!-- 2/3 - 1/3 -->
                    > > <div class="yui-gb first"> <!-- 1/3 - 1/3 - 1/3 -->
                    > > <div class="yui-u first">col 1.a</div> <!-- first unit -->
                    > > <div class="yui-u">col 1.b</div> <!-- unit -->
                    > > <div class="yui-u">col 1.c</div> <!-- unit -->
                    > > </div>
                    > > <div class="yui-gc"> <!-- 2/3 - 1/3 -->
                    > > <div class="yui-u first">col 2.a</div> <!-- first unit -->
                    > > <div class="yui-u">col 2.b</div> <!-- unit -->
                    > > </div>
                    > > </div>
                    > > </div>
                    > > </div>
                    > > </div>
                    > >
                    > >
                    > > </div>
                    > >
                    > >
                    > > </body>
                    > >
                    > >
                    > >
                    > >
                    >
                  • juliebonniedaisy
                    Christian, that sounds like good advice. I ll have to dig in a bit more to figure this out. Thank you again.
                    Message 9 of 14 , Nov 5, 2009
                    • 0 Attachment
                      Christian, that sounds like good advice. I'll have to dig in a bit more to figure this out. Thank you again.

                      --- In ydn-javascript@yahoogroups.com, Christian Tiberg <ctiberg@...> wrote:
                      >
                      > Sure, do it your way :) It was just a friendly note. I didn't learn that
                      > system at all, and I'm not using the YUI grids system either. I simply
                      > learned enough CSS to roll my own.
                      >
                      > The only thing I needed was to realize that setting float: none,
                      > display:inline on a div makes it work.
                      >
                      > Best regards,
                      > Christian Tiberg
                      >
                      >
                      > 2009/11/5 Matt Sweeney <msweeney@...>
                      >
                      > >
                      > >
                      > > Hi Julie,
                      > >
                      > > The issue is with the cascading rules. The units are incorrectly
                      > > inheriting the -gc rather than -gb.
                      > >
                      > > Adding the following to your stylesheet should resolve it:
                      > > .yui-gc .yui-gb .yui-u {
                      > > float: left;
                      > > width: 32%;
                      > > }
                      > >
                      > > I double-checked the grid builder, and it does include the full markup
                      > > template, including the "yui-main" div, but that isn't the issue here.
                      > > This is exactly the type of issue I am resolving with the updated yui3
                      > > grids.
                      > >
                      > > Sorry about the hassle.
                      > >
                      > > -Matt
                      > >
                      > >
                      > > juliebonniedaisy wrote:
                      > > > Thank you for the reply. I have used the grid builder many times and i
                      > > notice it does not include yui-main in the code it generates. Here is my
                      > > latest attempt based on your example but i'm finding col 1.c is going to the
                      > > next line and col 2.a and b go on a third line.
                      > > >
                      > > > Everything should stay on the same line though.
                      > > >
                      > > > <body class="yui-skin-sam main">
                      > > >
                      > > > <div id="doc3">
                      > > >
                      > > > <div id="bd">
                      > > > <div id="yui-main"> <!-- primary content -->
                      > > > <div class="yui-b"> <!-- basic block -->
                      > > > <div class="yui-gc"> <!-- 2/3 - 1/3 -->
                      > > > <div class="yui-gb first"> <!-- 1/3 - 1/3 - 1/3 -->
                      > > > <div class="yui-u first">col 1.a</div> <!-- first unit -->
                      > > > <div class="yui-u">col 1.b</div> <!-- unit -->
                      > > > <div class="yui-u">col 1.c</div> <!-- unit -->
                      > > > </div>
                      > > > <div class="yui-gc"> <!-- 2/3 - 1/3 -->
                      > > > <div class="yui-u first">col 2.a</div> <!-- first unit -->
                      > > > <div class="yui-u">col 2.b</div> <!-- unit -->
                      > > > </div>
                      > > > </div>
                      > > > </div>
                      > > > </div>
                      > > > </div>
                      > > >
                      > > >
                      > > > </div>
                      > > >
                      > > >
                      > > > </body>
                      > > >
                      > > >
                      > > >
                      > > >
                      > >
                      > >
                      > >
                      >
                    • juliebonniedaisy
                      Also, the builder only displays a yui-main div for me if I add a sidebar.
                      Message 10 of 14 , Nov 5, 2009
                      • 0 Attachment
                        Also, the builder only displays a yui-main div for me if I add a sidebar.

                        --- In ydn-javascript@yahoogroups.com, "juliebonniedaisy" <juliebonniedaisy@...> wrote:
                        >
                        > Thanks for the reply but the 2nd section(yui-gc) is still going to the 2nd line. Any ideas?
                        >
                        > --- In ydn-javascript@yahoogroups.com, Matt Sweeney <msweeney@> wrote:
                        > >
                        > > Hi Julie,
                        > >
                        > > The issue is with the cascading rules. The units are incorrectly
                        > > inheriting the -gc rather than -gb.
                        > >
                        > > Adding the following to your stylesheet should resolve it:
                        > > .yui-gc .yui-gb .yui-u {
                        > > float: left;
                        > > width: 32%;
                        > > }
                        > >
                        > >
                        > > I double-checked the grid builder, and it does include the full markup
                        > > template, including the "yui-main" div, but that isn't the issue here.
                        > > This is exactly the type of issue I am resolving with the updated yui3
                        > > grids.
                        > >
                        > > Sorry about the hassle.
                        > >
                        > > -Matt
                        > >
                        > > juliebonniedaisy wrote:
                        > > > Thank you for the reply. I have used the grid builder many times and i notice it does not include yui-main in the code it generates. Here is my latest attempt based on your example but i'm finding col 1.c is going to the next line and col 2.a and b go on a third line.
                        > > >
                        > > > Everything should stay on the same line though.
                        > > >
                        > > > <body class="yui-skin-sam main">
                        > > >
                        > > > <div id="doc3">
                        > > >
                        > > > <div id="bd">
                        > > > <div id="yui-main"> <!-- primary content -->
                        > > > <div class="yui-b"> <!-- basic block -->
                        > > > <div class="yui-gc"> <!-- 2/3 - 1/3 -->
                        > > > <div class="yui-gb first"> <!-- 1/3 - 1/3 - 1/3 -->
                        > > > <div class="yui-u first">col 1.a</div> <!-- first unit -->
                        > > > <div class="yui-u">col 1.b</div> <!-- unit -->
                        > > > <div class="yui-u">col 1.c</div> <!-- unit -->
                        > > > </div>
                        > > > <div class="yui-gc"> <!-- 2/3 - 1/3 -->
                        > > > <div class="yui-u first">col 2.a</div> <!-- first unit -->
                        > > > <div class="yui-u">col 2.b</div> <!-- unit -->
                        > > > </div>
                        > > > </div>
                        > > > </div>
                        > > > </div>
                        > > > </div>
                        > > >
                        > > >
                        > > > </div>
                        > > >
                        > > >
                        > > > </body>
                        > > >
                        > > >
                        > > >
                        > > >
                        > >
                        >
                      • Matt Sweeney
                        Hi Julie, I ve posted my working version here: http://yuilibrary.com/~msweeney/yui2/grids/nested_gc-gb.html -Matt
                        Message 11 of 14 , Nov 5, 2009
                        • 0 Attachment
                          Hi Julie,

                          I've posted my working version here:
                          http://yuilibrary.com/~msweeney/yui2/grids/nested_gc-gb.html

                          -Matt

                          juliebonniedaisy wrote:
                          > Thanks for the reply but the 2nd section(yui-gc) is still going to the 2nd line. Any ideas?
                          >
                          > --- In ydn-javascript@yahoogroups.com, Matt Sweeney <msweeney@...> wrote:
                          >> Hi Julie,
                          >>
                          >> The issue is with the cascading rules. The units are incorrectly
                          >> inheriting the -gc rather than -gb.
                          >>
                          >> Adding the following to your stylesheet should resolve it:
                          >> .yui-gc .yui-gb .yui-u {
                          >> float: left;
                          >> width: 32%;
                          >> }
                          >>
                          >>
                          >> I double-checked the grid builder, and it does include the full markup
                          >> template, including the "yui-main" div, but that isn't the issue here.
                          >> This is exactly the type of issue I am resolving with the updated yui3
                          >> grids.
                          >>
                          >> Sorry about the hassle.
                          >>
                          >> -Matt
                          >>
                          >> juliebonniedaisy wrote:
                          >>> Thank you for the reply. I have used the grid builder many times and i notice it does not include yui-main in the code it generates. Here is my latest attempt based on your example but i'm finding col 1.c is going to the next line and col 2.a and b go on a third line.
                          >>>
                          >>> Everything should stay on the same line though.
                          >>>
                          >>> <body class="yui-skin-sam main">
                          >>>
                          >>> <div id="doc3">
                          >>>
                          >>> <div id="bd">
                          >>> <div id="yui-main"> <!-- primary content -->
                          >>> <div class="yui-b"> <!-- basic block -->
                          >>> <div class="yui-gc"> <!-- 2/3 - 1/3 -->
                          >>> <div class="yui-gb first"> <!-- 1/3 - 1/3 - 1/3 -->
                          >>> <div class="yui-u first">col 1.a</div> <!-- first unit -->
                          >>> <div class="yui-u">col 1.b</div> <!-- unit -->
                          >>> <div class="yui-u">col 1.c</div> <!-- unit -->
                          >>> </div>
                          >>> <div class="yui-gc"> <!-- 2/3 - 1/3 -->
                          >>> <div class="yui-u first">col 2.a</div> <!-- first unit -->
                          >>> <div class="yui-u">col 2.b</div> <!-- unit -->
                          >>> </div>
                          >>> </div>
                          >>> </div>
                          >>> </div>
                          >>> </div>
                          >>>
                          >>>
                          >>> </div>
                          >>>
                          >>>
                          >>> </body>
                          >>>
                          >>>
                          >>>
                          >>>
                          >
                        • juliebonniedaisy
                          Thanks, it works great now, I was missing the yui-u on yui-gb and yui-gc. Thanks again Matt.
                          Message 12 of 14 , Nov 5, 2009
                          • 0 Attachment
                            Thanks, it works great now, I was missing the yui-u on yui-gb and yui-gc. Thanks again Matt.

                            --- In ydn-javascript@yahoogroups.com, Matt Sweeney <msweeney@...> wrote:
                            >
                            > Hi Julie,
                            >
                            > I've posted my working version here:
                            > http://yuilibrary.com/~msweeney/yui2/grids/nested_gc-gb.html
                            >
                            > -Matt
                            >
                            > juliebonniedaisy wrote:
                            > > Thanks for the reply but the 2nd section(yui-gc) is still going to the 2nd line. Any ideas?
                            > >
                            > > --- In ydn-javascript@yahoogroups.com, Matt Sweeney <msweeney@> wrote:
                            > >> Hi Julie,
                            > >>
                            > >> The issue is with the cascading rules. The units are incorrectly
                            > >> inheriting the -gc rather than -gb.
                            > >>
                            > >> Adding the following to your stylesheet should resolve it:
                            > >> .yui-gc .yui-gb .yui-u {
                            > >> float: left;
                            > >> width: 32%;
                            > >> }
                            > >>
                            > >>
                            > >> I double-checked the grid builder, and it does include the full markup
                            > >> template, including the "yui-main" div, but that isn't the issue here.
                            > >> This is exactly the type of issue I am resolving with the updated yui3
                            > >> grids.
                            > >>
                            > >> Sorry about the hassle.
                            > >>
                            > >> -Matt
                            > >>
                            > >> juliebonniedaisy wrote:
                            > >>> Thank you for the reply. I have used the grid builder many times and i notice it does not include yui-main in the code it generates. Here is my latest attempt based on your example but i'm finding col 1.c is going to the next line and col 2.a and b go on a third line.
                            > >>>
                            > >>> Everything should stay on the same line though.
                            > >>>
                            > >>> <body class="yui-skin-sam main">
                            > >>>
                            > >>> <div id="doc3">
                            > >>>
                            > >>> <div id="bd">
                            > >>> <div id="yui-main"> <!-- primary content -->
                            > >>> <div class="yui-b"> <!-- basic block -->
                            > >>> <div class="yui-gc"> <!-- 2/3 - 1/3 -->
                            > >>> <div class="yui-gb first"> <!-- 1/3 - 1/3 - 1/3 -->
                            > >>> <div class="yui-u first">col 1.a</div> <!-- first unit -->
                            > >>> <div class="yui-u">col 1.b</div> <!-- unit -->
                            > >>> <div class="yui-u">col 1.c</div> <!-- unit -->
                            > >>> </div>
                            > >>> <div class="yui-gc"> <!-- 2/3 - 1/3 -->
                            > >>> <div class="yui-u first">col 2.a</div> <!-- first unit -->
                            > >>> <div class="yui-u">col 2.b</div> <!-- unit -->
                            > >>> </div>
                            > >>> </div>
                            > >>> </div>
                            > >>> </div>
                            > >>> </div>
                            > >>>
                            > >>>
                            > >>> </div>
                            > >>>
                            > >>>
                            > >>> </body>
                            > >>>
                            > >>>
                            > >>>
                            > >>>
                            > >
                            >
                          Your message has been successfully submitted and would be delivered to recipients shortly.