Background CSS NOT SHOWING behind wrapper

Question

I've tried the background-image tag in my CSS and also in a tag in my HTML. I can't get anything to appear behind my wrapper. I can get my wrapper background to appear with color, but that it.

html,
body {
    background-image: url("https://vgy.me/u/TpG24N");
    text-align: center;
    height: 100%;

}

#wrapper {
    margin: 2% auto;
    width: 875px;
    height: 80%;
    box-sizing: border-box;
    background-color: rgb(250, 194, 245)
}

#subwrapper {
    position: relative;
}

Could you please add your HTML code, we don't know what your styles are referring to (divs, images, paragraphs?) — Jack Bashford, Sep 11 '18 at 03:12
you have placed an image behind the wrapper, but the image url is incorrect. Define the image url with extension .jpg or .png etc., — webcodesnip.com, Sep 11 '18 at 06:41

Poul Bak · Answer 1 · 2018-09-12T01:06:35.477

1

You set a background-color in #wrapper, that will not show anything BEHIND it. Simply set:

#wrapper{
 background-color: transparent;
}

Now the element behind #wrapper will show through.

Edit`:

You can also make it semi-transparent, if you want, keeping your color and set opacity to a value between 0 and 1, like this:

#wrapper {
    background-color: rgb(250, 194, 245)
    opacity: 0.5;
}

Now the #wrapper will have a semi-transparent color. Experiment with the right value for opacity, until it looks like you want.

edited Sep 12 '18 at 01:06

answered Sep 11 '18 at 03:16

Poul Bak

10,450
5
32
57

I changed this and corrected the URL and it works!! Thank you! – Angeline Slayton Sep 11 '18 at 19:14

score 1 · Answer 2 · answered Sep 11 '18 at 03:19

1

your background image url https://vgy.me/u/TpG24N is not refer to an image, do you mean https://vgy.me/TpG24N.jpg

html,
body {
    background-image: url("https://vgy.me/TpG24N.jpg");
    text-align: center;
    height: 100%;

}

answered Sep 11 '18 at 03:19

kite.js.org

1,599
10
11

score 0 · Answer 3 · answered Sep 11 '18 at 06:33

0

You did not add image extension URL

html,body {
    background-image: url("https://vgy.me/u/TpG24N");
    text-align: center;
    height: 100%;

}

Also, Need to add

#wrapper{
 background-color: transparent;
}

answered Sep 11 '18 at 06:33

Shakil Hossain

1,701
13
25

Background CSS NOT SHOWING behind wrapper

3 Answers3