Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Oct 2008
    Posts
    61
    Thanks
    7
    Thanked 0 Times in 0 Posts

    Problem using DIV's

    I am using DIV's for a layout but I keep getting a line in the background as shown below


    Here is my HTML...
    Code:
    <div class="content"><div class="roundedcornr_box_973715">
       <div class="roundedcornr_top_973715">
         <div></div>
       </div>
          <div class="roundedcornr_content_973715">
            <div class="container"> <div id="right">
              <div align="center">
    
                <p><img src="../../images/stickman/redstickman.png" alt="Red Stickman" /></p>
                <p><span class="style13">Suitable for white, black, silver, pale blue and any other light coloured surfaces except red surfaces</span></p>
                <p class="style13"><strong>RED STICKMAN</strong></p>
                <p><img src="" alt="" name="paypal" width="120" height="32" id="paypal" /></p>
              </div>
            </div><div id="right">
              <div align="center" class="style13"></div><div align="center" class="style13"></div>
            </div>
    
            </div>
          </div>
       <div class="roundedcornr_bottom_973715"><div></div></div>
    </div>
    Here is my CSS...
    Code:
    @charset "utf-8";
    /* CSS Document */
    
    			 
    .roundedcornr_box_973715 {
       background: #9bd2f1 url(/images/roundedcornr_973715_grad.gif) repeat-x top left;  width:30%; float:left; border: 2px solid #000000
    }
    .roundedcornr_top_973715 div {
       background: url(/images/roundedcornr_973715_tl.gif) no-repeat top left;
    }
    .roundedcornr_top_973715 {
       background: transparent url(/images/roundedcornr_973715_tr.gif) no-repeat top right;
    }
    .roundedcornr_bottom_973715 div {
       background: url(/images/roundedcornr_973715_bl.gif) no-repeat bottom left;
    }
    .roundedcornr_bottom_973715 {
       background: transparent url(/images/roundedcornr_973715_br.gif) no-repeat bottom right;
    }
    
    .roundedcornr_top_973715 div, .roundedcornr_top_973715,
    .roundedcornr_bottom_973715 div, .roundedcornr_bottom_973715 {
       width: 100%;
       height: 30px;
       font-size: 1px;
    }
    .roundedcornr_content_973715 { margin: 0 30px; }
    #container { clear:both; }
    #stick {
    height:auto;
    font-size:16px;
    font-weight:bold
      float: left;
      width: 100%;
      background-color: 000000;
      color:#000000; }
    .style13 {color: #333333}
    What am I doing wrong?

  • #2
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    We do not have all your code, especially the Doctype and html tags.

    effpeetee
    Last edited by effpeetee; 10-29-2008 at 01:43 PM.
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #3
    Regular Coder BoldUlysses's Avatar
    Join Date
    Jan 2008
    Location
    Winston-Salem, NC
    Posts
    938
    Thanks
    10
    Thanked 190 Times in 187 Posts
    I'd say it's probably an issue with your gradient background gif. Check at the bottom--there's a few darker pixels. Remove those and you should be good.
    matt | design | blog

  • Users who have thanked BoldUlysses for this post:

    blackwolf (10-29-2008)

  • #4
    New Coder
    Join Date
    Sep 2008
    Location
    Mexabet.biz
    Posts
    84
    Thanks
    12
    Thanked 0 Times in 0 Posts
    You didn't give us the specifics. So no one can be so sure. But looking at the code below, your background color is black: #000000 and it's visible from where your background image (with curved transparent edges) ends.
    Code:
    .roundedcornr_content_973715 { margin: 0 30px; }
    #container { clear:both; }
    #stick {
    height:auto;
    font-size:16px;
    font-weight:bold
      float: left;
      width: 100%;
      background-color: 000000;
      color:#000000; }
    .style13 {color: #333333}


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •