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

41808Re: YUI Layout Manager - Skinning the Layout

Expand Messages
  • tommy.bramble
    Dec 2, 2008
    • 0 Attachment
      Dav,

      Thanks so much! In fact, the last solution you provided would've
      worked if I had put it under the references to the layout skins.
      Rookie mistakes I'm making!

      Thanks again!

      -Tommy

      --- In ydn-javascript@yahoogroups.com, "Dav Glass" <davglass@...>
      wrote:
      >
      > Tommy --
      >
      > Try this one:
      >
      > .yui-skin-sam .yui-layout .yui-layout-hd,
      > .yui-skin-sam .yui-layout .yui-layout-ft,
      > .yui-skin-sam .yui-layout .yui-layout-unit div.yui-layout-bd-nohd,
      > .yui-skin-sam .yui-layout .yui-layout-unit div.yui-layout-bd-noft,
      > .yui-skin-sam .yui-layout .yui-layout-unit div.yui-layout-bd {
      > border: none;
      > }
      >
      > Also make sure and put these lines "after" the include of the
      layout.css
      > file. Since they are over-ride statements then need to be after the
      > original.
      >
      > Dav
      >
      > --
      > Dav Glass
      > davglass@...
      > 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 +
      >
      >
      > On Mon, Dec 1, 2008 at 2:01 PM, tommy.bramble
      <tommy.bramble@...>wrote:
      >
      > > http://www.tbramble.com/images/yuiTest.html
      > >
      > > Thanks!
      > >
      > > --- In ydn-javascript@yahoogroups.com <ydn-javascript%
      40yahoogroups.com>,
      > > "Dav Glass" <davglass@>
      > > wrote:
      > > >
      > > > Tommy --
      > > >
      > > > Please post a link to a page so I can see it ;)
      > > >
      > > > Thanks
      > > > Dav
      > > >
      > > > --
      > > > Dav Glass
      > > > davglass@
      > > > 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 +
      > > >
      > > >
      > > > On Mon, Dec 1, 2008 at 12:09 PM, tommy.bramble
      > > <tommy.bramble@>wrote:
      > >
      > > >
      > > > > Unfortunately that did not do it for me. I hadn't tried that
      > > exact
      > > > > combination, but I've tried many others like it. I can't
      figure
      > > out
      > > > > what I've done wrong. Here is the full code for the page:
      > > > >
      > > > > ***************START************************
      > > > > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML
      > > > > 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
      > > > > <html>
      > > > > <head>
      > > > > <meta http-equiv="Content-Type" content="text/html;
      charset=ISO-
      > > 8859-
      > > > > 1" />
      > > > > <title>Full Page Layout - Example</title>
      > > > > <style type="text/css">
      > > > > /*margin and padding on body element
      > > > > can introduce errors in determining
      > > > > element position and are not recommended;
      > > > > we turn them off as a foundation for YUI
      > > > > CSS treatments. */
      > > > >
      > > > >
      > > > > .yui-skin-sam .yui-layout .yui-layout-hd,
      > > > > .yui-skin-sam .yui-layout .yui-layout-ft,
      > > > > .yui-skin-sam .yui-layout .yui-layout-unit div.yui-layout-bd {
      > > > > border: none;
      > > > > }
      > > > >
      > > > > .yui-layout-wrap
      > > > > {
      > > > > border:none;
      > > > > }
      > > > >
      > > > > body {
      > > > > margin:0;
      > > > > padding:0;
      > > > > }
      > > > >
      > > > > #left1, yui-layout-unit-left
      > > > > {
      > > > >
      > > > > }
      > > > >
      > > > > </style>
      > > > > <link rel="stylesheet" type="text/css"
      > > > > href="Javascript/yui/build/reset-fonts-grids/reset-fonts-
      > > grids.css" />
      > > > > <link rel="stylesheet" type="text/css"
      > > > >
      href="Javascript/yui/build/button/assets/skins/sam/button.css" />
      > > > > <link rel="stylesheet" type="text/css"
      > > > > href="Javascript/yui/build/assets/skins/sam/resize.css">
      > > > > <link rel="stylesheet" type="text/css"
      > > > > href="Javascript/yui/build/assets/skins/sam/layout.css">
      > > > > <script type="text/javascript"
      > > src="Javascript/yui/build/yahoo/yahoo-
      > > > > min.js"></script>
      > > > > <script type="text/javascript"
      > > src="Javascript/yui/build/event/event-
      > > > > min.js"></script>
      > > > > <script type="text/javascript"
      src="Javascript/yui/build/dom/dom-
      > > > > min.js"></script>
      > > > > <script src="Javascript/yui/build/yahoo-dom-event/yahoo-dom-
      > > > > event.js"></script>
      > > > > <script src="Javascript/yui/build/dragdrop/dragdrop-
      > > min.js"></script>
      > > > > <script src="Javascript/yui/build/element/element-beta-
      > > > > min.js"></script>
      > > > > <script src="Javascript/yui/build/animation/animation-
      > > > > min.js"></script>
      > > > > <script src="Javascript/yui/build/resize/resize-
      min.js"></script>
      > > > > <script src="Javascript/yui/build/layout/layout-
      min.js"></script>
      > > > > </head>
      > > > >
      > > > > <body class=" yui-skin-sam">
      > > > > <div id="top1"><p>Header Content</p></div>
      > > > > <div id="left1">
      > > > > <p>Left Content</p>
      > > > > </div>
      > > > > <div id="center1">
      > > > > <p>Left Content</p>
      > > > > </div>
      > > > >
      > > > > <script>
      > > > >
      > > > > (function() {
      > > > > var Dom = YAHOO.util.Dom,
      > > > > Event = YAHOO.util.Event;
      > > > >
      > > > > Event.onDOMReady(function() {
      > > > > var layout = new YAHOO.widget.Layout({
      > > > > units: [
      > > > > { position: 'top', height: 50, body: 'top1' },
      > > > > { position: 'left', width: 200, resize: true,
      > > > > body: 'left1', scroll: true },
      > > > > { position: 'center', body: 'center1' }
      > > > > ]
      > > > > });
      > > > > layout.render();
      > > > >
      > > > > });
      > > > >
      > > > > })();
      > > > > </script>
      > > > > </body>
      > > > > </html>
      > > > >
      > > > > ****************END***************
      > > > >
      > > > > --- In ydn-javascript@yahoogroups.com<ydn-javascript%
      40yahoogroups.com><ydn-javascript%
      > > 40yahoogroups.com>,
      > >
      > > > > "Dav Glass" <davglass@>
      > > > > wrote:
      > > > > >
      > > > > > tommy.bramble --
      > > > > >
      > > > > > Something like this should do it:
      > > > > > .yui-skin-sam .yui-layout .yui-layout-hd,
      > > > > > .yui-skin-sam .yui-layout .yui-layout-ft,
      > > > > > .yui-skin-sam .yui-layout .yui-layout-unit div.yui-layout-
      bd {
      > > > > > border: none;
      > > > > > }
      > > > > >
      > > > > > Dav
      > > > > >
      > > > > > --
      > > > > > Dav Glass
      > > > > > davglass@
      > > > > > 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 +
      > > > > >
      > > > > >
      > > > > > On Mon, Dec 1, 2008 at 9:37 AM, tommy.bramble
      > > > > <tommy.bramble@>wrote:
      > > > > >
      > > > > > > I'm using the layout manager to create a paneled layout
      > > > > (header, left,
      > > > > > > right). All the element units are working great, but I
      have a
      > > gray
      > > > > > > border around each element. I've looked over the skinning
      > > > > information
      > > > > > > for awhile now and can't seem to get rid of the gray
      border.
      > > Can
      > > > > > > anyone help me out with this?
      > > > > > >
      > > > > > > Any help is greatly appreciated!
      > > > > > >
      > > > > > >
      > > > > > >
      > > > > >
      > > > >
      > > > >
      > > > >
      > > >
      > >
      > >
      > >
      >
    • Show all 8 messages in this topic