Hey Bryan,
On Dec 4, 2008, at 1:29 PM, Kraulin wrote:
> I'm having an issue with Grids. I'm trying to do some nesting of a
> yui-gd in a yui-gb. However when I place the gd inside gb, my gd is
> forced into what appears to be 1/3rd of the outer gb. What I'm
> expecting it to do is take up the whole width of the outer gb.
>
> I have created an example to illustrate...
>
> -=Bryan
>
For this nesting structure you'll need to apply a one-line CSS patch:
<style>
.yui-gb .yui-gd {width:100%;margin-left:0;}
</style>
Here's an example of that patch in action that I created for you:
http://yuiblog.com/sandbox/yui/v260/grids/gd-in-gb.html
Hope that helps.
Thanks,
Nate
> =============================================
> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
> "
http://www.w3.org/TR/html4/strict.dtd">
> <html>
>
> <head>
> <title>A Title</title>
> <link rel="stylesheet" type="text/css"
href="
http://ajax.googleapis.com/ajax/libs/yui/2.6.0/build/reset-fonts-grids/res\
et-fonts-grids.css
> " />
> <link rel="stylesheet" type="text/css"
href="
http://ajax.googleapis.com/ajax/libs/yui/2.6.0/build/base/base-min.css
> " />
> </head>
>
> <body>
>
> <div id="doc3" class="yui-t6">
>
> <div id="hd" style="background:pink;">
> <p>Header</p>
> </div>
>
> <div id="bd">
>
> <div id="yui-main">
> <div class="yui-b">
> <div class="yui-gb">
> <div class="yui-u first col1" style="background:cyan;">
> <p>Lorem ipsum dolor sit</p>
>
> <!-- Why does this not fill out cyan block into 1/3rd and 2/3rds? -->
> <div class="yui-gd">
> <div class="yui-u first" style="background:lightgreen;">
> <p>1</p>
> </div>
> <div class="yui-u" style="background:pink;">
> <p>2</p>
> </div>
> </div>
>
> </div>
> <div class="yui-u col2" style="background:cyan;">
> <p>Lorem ipsum dolor sit amet, consectetuer</p>
> </div>
> <div class="yui-u col3" style="background:cyan;">
> <p>Lorem ipsum dolor sit amet, consectetuer adipiscing</p>
> </div>
> </div>
> </div>
> </div>
>
> <div class="yui-b" style="background:lightgreen;">
> <p>
> 300 px wide right side column - Lorem ipsum dolor sit amet,
> consectetuer adipiscing elit, sed diam nonummy nibh euismod
> tincidunt ut laoreet dolore magna
> aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud
> exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea
> commodo consequat. Duis
> autem vel eum iriure dolor in hendrerit in vulputate velit esse
> molestie consequat, vel illum dolore eu feugiat nulla facilisis at
> vero eros et accumsan et
> iusto odio dignissim qui blandit praesent luptatum zzril
> </p>
> </div>
>
> </div>
> <div id="ft" style="background:pink;">
> <p>
> Footer - Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
> Maecenas sit amet metus. Nunc quam elit,
> </p>
> </div>
> </div>
>
> </body>
>
> </html>
>
>
> ------------------------------------
>
> Yahoo! Groups Links
>
>
>
Having problems with message search?
Fill out this form to ensure your group is one of the first to be migrated to the new message search system.
Offline 
Send Email