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

Re: cant get left margin with yahoo css in body

Expand Messages
  • adolfo foronda
    Figured out the problem was the use of margin , especially when used with top or bottom . The solution was to use padding , that only took me 3 days to
    Message 1 of 4 , Dec 3, 2008
    • 0 Attachment
      Figured out the problem was the use of "margin", especially when used
      with "top" or "bottom". The solution was to use "padding", that only
      took me 3 days to figure out, ugh.

      --- In ydn-javascript@yahoogroups.com, "adolfo foronda" <aforonda@...>
      wrote:
      >
      > I'm using the yui-t5 layout and i'm getting killed by the right column
      > aka secondary block in the body.
      >
      > I'm trying to follow a design where there is some text with a
      > background color, all i'm trying to do is add a margin around the text
      > but when I do so it displays the white background rather then giving
      > the text more background color.
      >
      > I've tried multiple variations and have no luck, can you recommend a
      > solution?
      >
      > <!-- Begin Right Col -->
      > <div class="yui-b">
      > <div style="background-color:#d4e4ee;">
      > <h1 style="background-color:#d4e4ee; margin:5px;">Lorem ipsum</h1>
      > </div>
      > </div>
      > <div style="background-color:#bed0e2; margin:5px;">
      > <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
      > Maecenas sit amet metus. zczxczczx Nunc quam elit, posuere nec, auctor
      > in, rhoncus quis, dui. Aliquam erat volutpat. Ut dignissim, massa sit
      > amet dignissim cursus, quam lacus feugiat.</p>
      > </div>
      >
      > Thanks,
      > Adolfo
      >
      > --- In ydn-javascript@yahoogroups.com, Nate Koechley <natek@> wrote:
      > >
      > > Hey Adolfo,
      > >
      > > I recommend that you put all your implementation-specific style
      rules
      > > on nodes that are descendants of Grids' nodes instead of on Grids'
      > > nodes directly.
      > >
      > > Instead of this:
      > >
      > > <div class="yui-g" style="margin-left:5px;">
      > >
      > > Try this:
      > >
      > > <div class="yui-g">
      > > <div style="margin-left:5px;">
      > >
      > > I make this recommendation because Grids is already setting various
      > > style rules on its nodes and if you overwrite these Grids may no
      > > longer work as designed. Inside of the structure that Grids uses you
      > > can safely set anything you want.
      > >
      > > That said, note that you can use #doc3 on the page's outermost
      wrapper
      > > which sets the overall page width to 100% but with 10px of left and
      > > right margin so the text isn't right up to the edge of the viewport.
      > > You're welcome to modify those margins directly if you want.
      Here's an
      > > example of that:
      > >
      > > http://yuiblog.com/sandbox/yui/v260/grids/margin.html
      > >
      > > Hope that helps.
      > >
      > > Thanks,
      > > Nate
      > >
      > >
      > > On Nov 26, 2008, at 11:33 AM, adolfo foronda wrote:
      > >
      > > > Weather in 2 blocks #bd or a grid scenario I am unable to get a
      right
      > > > column to get a left-margin value to stick. Thus the text is flush
      > > > left against the border and our designer wants some margin, how the
      > > > heck is this done with yui css?
      > > >
      > > > <div id="bd">
      > > > <div class="yui-g" >
      > > > <div class="yui-g first" style="margin-left:5px;">
      > > > <p>Lorem ipsum dolor sit amet</p>
      > > > </div>
      > > >
      > > > <!-- Begin Right Col This margin will not display!-->
      > > > <div class="yui-g" style="margin-left:5px;">
      > > >
      > > > <p>Lorem ipsum dolor sit amet, consectetuer adipiscing
      > > > elit. Maecenas sit amet metus. zczxczczx Nunc quam elit, posuere
      nec,
      > > > auctor in, rhoncus quis, dui. Aliquam erat volutpat. Ut dignissim,
      > > > massa sit amet dignissim cursus, quam lacus feugiat.</p>
      > > > </div>
      > > > <!-- End Right Col -->
      > > > </div>
      > > > </div>
      > > >
      > > > Thanks in advance,
      > > > Adolfo
      > > >
      > > >
      > > > ------------------------------------
      > > >
      > > > Yahoo! Groups Links
      > > >
      > > >
      > > >
      > >
      >
    Your message has been successfully submitted and would be delivered to recipients shortly.