SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Jul 2010
    Posts
    16
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    why is my image repeating?

    really flumoxed here. this logo should not be repeating but yet it is, can you help me out guys,
    image is coming out side by side


    Code:
    <html>
    <head>
    
    <link href="styles.css" rel="stylesheet" type="text/css" />
    
    </head>
    <body>
    
    <div  id="container">
    	<div id="header">
    		<h1><a href="#"> Coolmine MMA</a><h1>
    			
    	</div>
    </div>
    
    </body>
    
    </html>
    CSS


    Code:
    * { margin: 0; padding: 0; }
    
    
    body {
      background: #fff url(images/bg_body.jpg) repeat-x 0 0;
      font-family: Arial, Helvetica, sans-serif;
    }
    
    
    #container {
      width: 960px;
      margin: 0 auto;
      padding: 0 10px;
    }
    
    #header {
      position:relative;
      width:960px;
    }
    
    #header h1 {
      display:block;
      float:left;
      width:400px;
      height:120px;
      background:url(images/logo.jpg)no-repeat 0 0; 
      text-indent:-9999px;
    }
    
    #header h1 a {
      display: block;
      height: 100%;
      width: 100%;
    }
    Last edited by ralph.m; Aug 27, 2012 at 16:57. Reason: added code tags

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,177
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    Without seeing the site, all I can suggest is you remove the gap between the right parenthesis and the "no-repeat":

    Code:
    background:url(images/logo.jpg)no-repeat 0 0;

  3. #3
    Ripe Tomatos silver trophybronze trophy Rayzur's Avatar
    Join Date
    Jun 2007
    Location
    Texas
    Posts
    4,174
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    logo should not be repeating but yet it is
    Hi,
    You failed to close the h1 tag and that is causing the heading to be rendered twice.

    all I can suggest is you remove the gap between the right parenthesis and the "no-repeat"
    Actually that can cause problems in older versions of IE. I don't see a gap in the code, but I would put the space in there.
    I guess I still do it out of habit.

    Code:
    background:url(images/logo.jpg) no-repeat 0 0;

  4. #4
    SitePoint Member
    Join Date
    Jul 2010
    Posts
    16
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Rayzur View Post
    Hi,
    You failed to close the h1 tag and that is causing the heading to be rendered twice.


    Actually that can cause problems in older versions of IE. I don't see a gap in the code, but I would put the space in there.
    I guess I still do it out of habit.

    Code:
    background:url(images/logo.jpg) no-repeat 0 0;
    Oh my God, I cant believe that's what I missed closing that. I sat there for an hour last night looking and didn't see that. Kicking myself here- thanks guys

  5. #5
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,177
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by ralph.m View Post
    all I can suggest is you remove the gap between the right parenthesis and the "no-repeat"
    Duh, I meant remove the lack of a gap ... or, in other words, put the gap in.


Bookmarks

Posting Permissions

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