Support » Themes and Templates » Header image repeating itself

  • Resolved traysee100


    When I try to edit my CSS, there is no code in there for me to set it to NO REPEAT. Can anyone help?

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


    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:


    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


    Forum moderator

    See the CSS examples on this article

    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:

    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?

    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!

    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 ‘Header image repeating itself’ is closed to new replies.