Horizontal line near the picture



  • We need to do the picture:
    alt text

    There are very many horizontal lines on the website (described red). They should be all over the bloc. But if the line is near the picture. float:left/rightthe line shall reach only the picture (+) margin) And it turns out that the line is stretched all wide and goes under the picture. Line made <div>- Tom:

    .line {
      height:1px;
      margin:22px 0 26px 0;
      background:#c7c7c7;
      border-bottom:1px solid #fff;
    }
    

    If you do <hr> instead <div>the line is normal, but there are other problems, so... <hr> It doesn't work. Tell me, can we do this at all, and if you can?



  • Try to turn the image in. div with the coloured background and padding are equal to the necessary deviations of the picture.

    <style type="text/css">
    .line {
    height:1px;
    margin:22px 0 26px 0;
    background:#c7c7c7;
    border-bottom:1px solid #fff;
    }
    .img_wrapper {
    float:left; 
    padding:10px 10px 10px 0; 
    background:#fff;
    }
    </style>
    

    текст
    <div class="img_wrapper"><img src="" /></div>
    текст
    <div class="line"></div>
    текст

    It's got to single-coloured.


Log in to reply
 


Suggested Topics

  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2