background disappearing after adding background-image:no-repeat;

Question

I am trying to set a background image for my wordpress website.

.content:before {
content: "";
background-image: url("gfx/SevenWonders.jpg");
/*background: #fff;*/
background-size:600px 700px;
background-repeat: no-repeat;
position: absolute;
z-index: -9999;
top: 0;
right: 28.5%;
bottom: 0;
left: -10000px;
}

this is my css code with background-image. I resized the size because the image

is pretty large for my website. AND! after adding background-repeat: no-repeat,

the background is not displayable. I see only white background.

Of course, I googled to find the solutions, but almost all of them are saying

about syntax error, but I cannot find any syntax mistakes in my code ..

@ajinkyanarkar hmmm.. I am not sure.. because I am working with wordpress and I am working with php and style.css files.. and css file is really really big.. it has total 3000+lines.. — ProgramLover, Apr 28 '17 at 13:29
@AhmedGinani sorry, I don't know and any websites which allows upload codes and share the codes with other. Github? is not registered. I fixed my problem. I just found the suitable size. Sorry — ProgramLover, Apr 28 '17 at 13:45

score 0 · Answer 1 · answered Apr 28 '17 at 13:58

check this fiddle. Problem is with your left property value in css.

.content:before {
content: "";
background-image: url("https://placeholdit.imgix.net/~text?txtsize=33&txt=350%C3%97150&w=350&h=150");
/*background: #fff;*/
background-size:600px 700px;
background-repeat: no-repeat;
position: absolute;
z-index: -9999;
top: 0;
right: 28.5%;
bottom: 0;
left: 0px;
}

background disappearing after adding background-image:no-repeat;

1 Answers1