html - Left & Right Background CSS in div changes body content container width -


i put display background on left , right side of website.

now in place body container appearing wider before. why be?

can see isn't code in below?

   div#multi-background {         width: 100%;         height: 100%;         background-image: url(http://cdn.shopify.com/s/files/1/0834/6311/t/2/assets/right-1.png), url(http://cdn.shopify.com/s/files/1/0834/6311/t/2/assets/left-1.png);         background-position: center right, top left;         background-repeat: no-repeat;     }      @media screen , (min-width: 481px) {     //happens when screen size >= 481px      div#multi-background {         width: 100%;         height: 100%;         background-image: url(http://cdn.shopify.com/s/files/1/0834/6311/t/2/assets/right-1.png), url(http://cdn.shopify.com/s/files/1/0834/6311/t/2/assets/left-1.png);         background-position: center right, top left;         background-repeat: no-repeat;      }     }      @media screen , (max-width: 481px) {     //happens when screen size <= 481px      div#multi-background {        background-image: none;      }     } 

fiddle - http://jsfiddle.net/timsalabim/1mk097vb/8/

if got right, code want:

#multi-background {      height: 700px;      background-image: url(http://cdn.shopify.com/s/files/1/0834/6311/t/2/assets/right-1.png), url(http://cdn.shopify.com/s/files/1/0834/6311/t/2/assets/left-1.png);      background-position: center right, top left;      background-repeat: no-repeat;  }    @media screen , (min-device-width: 481px) {  /*happens when screen size bigger 481px */   #multi-background {      width: 100%;      background-image: url(http://cdn.shopify.com/s/files/1/0834/6311/t/2/assets/right-1.png), url(http://cdn.shopify.com/s/files/1/0834/6311/t/2/assets/left-1.png);      background-position: center right, top left;      background-repeat: no-repeat;   }  }    @media screen , (max-device-width: 481px) {  /*happens when screen size lower 481px*/  #multi-background {     background-image: none;   }  }
<body><div id="multi-background"></div>

the comments not written "/" , "/". there problems @media declaration , height issues more 481 px.

hope helps.


Comments

Popular posts from this blog

asp.net mvc - SSO between MVCForum and Umbraco7 -

Python Tkinter keyboard using bind -

ubuntu - Selenium Node Not Connecting to Hub, Not Opening Port -