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

Re: margins for paragraphs

Expand Messages
  • Cary
    I ll admit I m having trouble following this, but you might use padding on the div to create space between it and the paragraph it contains rather than using a
    Message 1 of 2 , Sep 29, 2007
    • 0 Attachment
      I'll admit I'm having trouble following this, but you might use
      padding on the div to create space between it and the paragraph it
      contains rather than using a margin on the paragraph. So for you
      example code you gave you could use this styling:

      <style type="text/css">
      .BLUE {
      margin: 0;
      padding: 20px;
      background-color: #0000FF;
      width: 250px;
      }
      .WHITE {
      margin: 0;
      padding: 0 0 1ex;
      background-color: #FFFFFF;
      }
      .GRAY {
      margin: 0;
      padding: 0 0 1ex;
      background-color: #E9E9E9;
      }
      P {
      margin: 1ex 5% 0;
      padding: 0;
      border: 0;
      background-color: #FF0000;
      }
      IMG {
      margin: 1ex 5%;
      padding: 0;
      border: 0;
      background-color: #FF0000;
      }
      </style>



      --- In ntb-html@yahoogroups.com, Axel Berger wrote:
      >
      > A margin seens to be rather a well defined entity in style sheets, but
      > there is one nasty exception:
      > The top and bottom margins of paragraphs and headers apply only to other
      > visible elements. A well known example is the margin above a header
      > which is not shown when that header is the first thing on a page. That
      > may be fine, but those dropped margins still exist somewhere in the
      > works and cause all kinds of trouble.
      >
      > One problem I have is an image with a small bottom margin on a dark
      > background. Beneath that image is a DIV container with a white
      > background, leaving a small dark stripe between it and the image. So far
      > exactly what is wanted here. Now I place a paragraph inside the
      > container. That paragraph has a wider top margin, which gets ignored by
      > the DIV, so there's no white stripe on top. BUT the margin still applies
      > versus the image and pushes the whole DIV downwards widening the black
      > stripe - nasty!
      > It gets worse if I have two unmargined containers overlying the black,
      > say white and light gray, that sit flush against each other. Place a
      > paragraph in each one and they get pushed apart exposing a black stripe.
      > Even nastier, unexpected, and very undesirable.
      >
      > Is there any straightforward and easy solution for this or do I have to
      > stick with my present workaround involving classes inside classes?
      >
      > Danke
      > Axel
      >
    Your message has been successfully submitted and would be delivered to recipients shortly.