WordPress.org

Support

Support » Themes and Templates » [Resolved] Header image repeating itself

[Resolved] Header image repeating itself

Viewing 11 replies - 1 through 11 (of 11 total)
  • Moderator Andrew Nevins

    @anevins

    Forum moderator

    Don’t edit the files.
    Make your changes through a Custom CSS plugin.

    Thank you for your response. I tried the Custom CSS and typed:

    <body>
    background-repeat:no-repeat
    </body>

    and then saved the changes and it reverts back to nothing and doesn’t make the change. What am I doing wrong?

    Moderator Andrew Nevins

    @anevins

    Forum moderator

    See the CSS examples on this article
    http://www.w3schools.com/css/css_howto.asp

    Regarding the syntax of CSS.

    traysee,URL please.
    Basically,you want to stop the header image (not the background) to repeat itself.

    MEDIA X:

    URL is: http://the-byrds-nest.net

    Right, I know that I need to stop the header image from repeating, but I cannot figure out “how”… Thank you for your input.

    style.css @ line 390

    `
    #header {
    background-image: url(images/header-bg.jpg);
    background-repeat: no-repeat;
    border-bottom: 1px solid #dfdfdf;
    }

    Thank you Media X, I truly appreciate your help. Now, my image has changed, however, it is still repeating and the image is now too big and my title is lost. From WordPress, I just edited my widget Custom CSS with this code. I didn’t enter it in line 390 because I did not know how to do that. Is it time I paid someone for assistance with my blog?

    paulwpxp

    @paulwp

    Font hero

    In your Custom CSS plugin, just put this

    #header {background-repeat: no-repeat;}

    Copy and paste as is, don’t worry about the line number, he was just trying to tell where the code is to override.

    Also, from a design point, if you could blur out both edges of your header bg image to be that solid blue and use that as background color (header area), it would look great.

    Thanks Paul for the help! Here is the code that I entered:

    #header {background-repeat: no-repeat; margin: 0 auto 0 auto; width: 1264px; height: 270px; }

    This was so that I could get the image to center, however, even though my image is the size listed above, I have this weird top border and right-side border. I don’t know how those things got there! Do you know how I would go about removing those?

    I’m also trying to figure out how to blur as you have suggested because I like that idea!

    paulwpxp

    @paulwp

    Font hero

    This’d take care of the bg alignment, use this instead of the previous.

    #header {
    	background-position: 50% 0;
    	background-repeat: no-repeat;
    }

    This’d get rid of the top most bar ( not sure if this is what you refered to as top border ).

    #header .top-bg {
    	display: none;
    }

    It’s actually a design element to match site’s footer. I would keep it like that, it helps bring out the logo and white backgroud, but it’s up to you.

    Thank you Paul!

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘[Resolved] Header image repeating itself’ is closed to new replies.
Skip to toolbar