On Wed, Jul 27, 2016 at 3:31 PM, Crest Christopher <
crestchristop...@gmail.com> wrote:
> Correct me if I'm wrong but shouldn't a rule further down the cascading
> over ride any previous rules before ?
>
> 1st.
> #inner {
> position:relative;
>
>
> background-image:url("/wdp/wip/images/l2b_innertop.png"),url("/wdp/wip/images/l2b_innerfooter.jpg"),url("/wdp/wip/background-paper.jpg");
> background-repeat:no-repeat,no-repeat,repeat;
> padding-bottom:10%,padding-bottom:0;
> background-size:100%;
> background-position:top,bottom
> }
>
> 2nd (Or further down in the cascade) This rule override the previous
> rule for the same element ? My paths are setup correctly, the image is
> on the server but doesn't load ?
> #inner {
> background-image:url("/wdp/wip/images/bg_paper.Hi.jpg");
> background-repeat:repeat;
> }
>
I just used this in a test:
@media screen and (min-width: 480px){
.test{
position: relative;
background-image: url("img/img1.jpg"), url("img/img2.jpg"),
url("img/img3.png");
background-repeat: no-repeat;
background-position: 0 0, 500px 0, 1000px 0;
height: 500px;
width: 5000px;
}
}
@media screen and (min-width: 900px){
.test{
background-image: none, url("img/img4.jpg"), none;
}
}
and what I expected to happen happened, which was that the 3 images were
replaced with the single 4th image and positioned at img2's position, at
900px wide. I think you need to make sure you are accounting for the
attributes of all three initial images when you override them.
HTH
--
Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com
#663399
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
