Can I avoid using !important in this situation (re: media querie)

[br3n]

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

@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;}}

It doesn't work - But if I do this

@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;}}

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

 

[br3n]

Arrff I was being a div...

overlooked the most obvious method and all sorted now

section.portfolio-container ul.portfolio-gallery-items li a { background-position: 0 0; }

BUT... if I had used the same selector(s) for my original code I assume I would still have to use !important? so media queries don't over-rule everything?

example:

section.portfolio-container ul.portfolio-gallery-items li a.veng-web:link, section.portfolio-container ul.portfolio-gallery-items li a.veng-web:visited { background-image: url(images/portfolio/sprites/veng-web.png); background-position: 0 -200px; }section.portfolio-container ul.portfolio-gallery-items li a.veng-web:hover, section.portfolio-container ul.portfolio-gallery-items li a.veng-web:active, section.portfolio-container ul.portfolio-gallery-items li a.veng-web:focus { background-position: 0 0; }

To over-rule that within a media query would I have to use !important?