Search code examples
cssinternet-explorer-11calcbackground-position

A small question about background and calc()


all.

I'm working on a project. I have small question. about calc function.

as everyone know.. it's working on all browsers..

========== ok =============

background-color:#dfdfdf;
background-image:url(..);
background-position: calc(100% - 10px) center;
background-repeat: no-repeat;

but why next code doesn't working on IE11??

==========do not working on IE 11 =============

background:#dfdfdf url(..) no-repeat calc(100% - 10px) center;

-_-;;;;;;;;;;;;;;;;


Solution

  • Ie11 must be used separately

    body
         {
    background:#dfdfdf url("https://www.w3schools.com/w3css/img_lights.jpg") no-repeat;
    background-position:calc(100% - 100px) center;
    }
    <!DOCTYPE html>
    <html>
    <head>
         <meta http-equiv="content-type" content="text/html; charset=utf-8">
         <link rel="stylesheet" type="text/css" href="css/style.css">
         <title>Page Title</title>
         <meta name="description" content="Write some words to describe your html page">
       
    </head>
    <body>
    
    
    </body>
    
    </html>