Background fixed & cover - Internet explorer 11

css internet-explorer-11 background-attachment
Robb picture Robb · Feb 12, 2014 · Viewed 7.2k times · Source

http://apolytos.com/new/img/test.html

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style>
body {
    background:url("background.jpg");
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-size: cover;
    background-position:top center;
    margin:0;
}
</style>
</head>
<body>
</body>
</html>

Internet Explorer 11 is NOT covering; view the link provided. If I remove the :fixed, it covers as it's supposed to, however the bg scrolls with content on page which is not desired. There appears to be a conflict with these 2 lines of code in IE.

Answer

Eldwin Eldwin picture Eldwin Eldwin · Feb 12, 2014

try this code, it should work well. 

html { 
  background: url(images/bg.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

Related questions

How to write a CSS hack for IE 11?

How can I hack or write css only for IE 11? I have a website that looks bad in IE 11.I just search here and there but didnt find any solution yet. Is there any css selector?

Read More
CSS Grid Layout not working in IE11 even with prefixes

I'm using following HTML markup for my grid. <section class="grid"> <article class="grid-item width-2x height-2x">....</article> <article class="grid-item">....</article> <article class="grid-item">....</article&…

Read More
Flexbox Not Centering Vertically in IE

I have a simple web page with some Lipsum content that is centered on the page. The page works fine in Chrome and Firefox. If I reduce the size of the window, the content fills the window until it can't …

Read More