The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Mobile first and overriding inline style on small screens

  • This topic is empty.
Viewing 1 post (of 1 total)
  • Author
  • #41635

    My approach on a site I’m currently working is to use min-width media queries to build up the page as the screen gets bigger. Background images of components are content managed so they are set using inline styles. However the designs dictate that the background images don’t appear on small screens.

    I’m aware that background-image: none !important; will override inline styles for the mobile version but how do I effectively override this !important declared later in the stylesheet?

    One approach since it’s a no-repeat background is to position the background -10000px or something but the mobile users will still download this resource unfortunately so I’m hoping there are better suggestions. Cheers.

    [CodePen]( “Example on CodePen”)

Viewing 1 post (of 1 total)
  • The forum ‘CSS’ is closed to new topics and replies.