CODEWITHSUNDEEP
cssbackground-imageinternet-explorer-11
Kirk Ross
Kirk Ross

Reputation: 7153

Background images not showing in IE11

For some reason, background images are not showing up at all in IE11 (Windows 7 Pro).

.home {
position:relative;
height: 620px;
background-image: url(/images/bg_home3.jpg);
background-position: 540px 190px;
background-repeat: no-repeat;
}

Any clues?

Upvotes: 2

Views: 20857

Answers (5)

Max W
Max W

Reputation: 1

I found setting the background size of the image made it display in IE11.

I also had to set the width and height. Setting the value of these attributes to auto it didn't work.

Upvotes: 0

user11431212
user11431212

Reputation:

I think with two easy steps you can eliminate the problem:

  1. Set display: block; The display property specifies the display behavior on your page. IE 8 and upper versions fully supports this property.
  2. Put your url between quotation marks (""). background-image: url("/images/something.jpg");

Upvotes: 0

Fred
Fred

Reputation: 36

Use a png image as it seems IE 11 cannot display jpg with non web colors.

Upvotes: 0

George Pandurov
George Pandurov

Reputation: 391

If you are trying to set background to HTML5 element there is a chance that it doesn't have some default style in IE11. For example if the element is main try to set display: block to it. You may also try to set width, but without seeing more of your code can't help you more. Look the example below.

.home {
    display: block;
    width: 100%;
    position:relative;
    height: 620px;
    background-image: url("/images/bg_home3.jpg");
    background-position: 540px 190px;
    background-repeat: no-repeat;
}

Upvotes: 4

alessandrio
alessandrio

Reputation: 4370

necessary use width: 100px; <= you size px

.home {
position:relative;
height: 620px;
width: 200px;
background-image: url('/images/bg_home3.jpg');
background-position: 540px 190px;
background-repeat: no-repeat;
}

Upvotes: 1

Related Questions