br3n
Senior Member
Hello there!
On my current website Basement31 - Brendan Patterson. Designer. my portfolio links are black and white until you roll over them (simple change of background position on hover) I've used media queries already to serve up a slightly different design for smaller browser windows such as phones or tablets... so far so good.
However - given that those devices dont really have a :hover function I want to override the background position change in my media querie...
If I do this..
(changing the background position from 0 -200px; as expressed in my css to 0 0
It doesn't work - But if I do this
It does.(the only difference was the addition of !important)
My question is, am I missing something here or is there a better way of making this happen without resorting to !important ??
Thanks
On my current website Basement31 - Brendan Patterson. Designer. my portfolio links are black and white until you roll over them (simple change of background position on hover) I've used media queries already to serve up a slightly different design for smaller browser windows such as phones or tablets... so far so good.
However - given that those devices dont really have a :hover function I want to override the background position change in my media querie...
If I do this..
(changing the background position from 0 -200px; as expressed in my css to 0 0
Code:
@media only screenand (min-width : 320px)and (max-width : 650px) { a.veng-web { background-image: url(images/portfolio/sprites/veng-web.png); background-position: 0 0;}}
Code:
@media only screenand (min-width : 320px)and (max-width : 650px) { a.veng-web { background-image: url(images/portfolio/sprites/veng-web.png); background-position: 0 0 !important;}}
My question is, am I missing something here or is there a better way of making this happen without resorting to !important ??
Thanks