This should be simple but want to do it right. CSS display:none; how to turn back on according to @media

Tags: css,mobile,screen,media

Problem :

Hello I have css code that displays css div's according to screen size.

problem is that some browsers are not supporting the @media properly

so I want to turn off DIV's out of the box

.s2 {



so how could I turn .s2 back on with this

@media handheld, screen and (max-width:769px) and (min-width:513px) {

.s2 {


whould this work just fine and what is the default display property I need to set it back to? block?

Thanks for your help


Solution :

Depends how you want to display the item. You could use display: block, or display: initial if you want to display the divs initial state. More display options found here :

    CSS Howto..

    How to make element stay in the same position using css?

    How to apply a drop shadow on a triangle in CSS?

    How to use media queries for mobile devices and desktop?

    How to append an
  • to a
      and set css on the
    • at the same time with jquery
  • How to draw a horizontal line between two circles with css?

    How to always show up pure HTML5/CSS modal window without clicking a link which activates it?

    How to keep CSS style If I change the html content dynamically?

    How to modify programmatically with javascript the css ::before and ::after [duplicate]

    How is this font face in CSS3 embedded into a css file?

    How to change the css class name dynamically in angular 2

    How to stop active effect occurring on all sub menu options from navbar

    how to set formatting of all textbox in website with css, without set cssclass property of each textbox

    custom styles not effecting the nested accordion jquery - How to fix

    How to reset css (a:visited{color:green}) when refresh browser address bar

    How to define alternative font-family corresponding to font-size CSS

    How to change color of selection in Select2 4.0.1?

    Jquery Ui Sortable showing broken image in IE8

    How to scale a .svg being the background in a div?

    How to push elements after absolute element

    How do I make CSS hover transitions animate on mouse off AND mouse over, and replicate that in jQuery?

    How do I get spotlight/shadow position to remain exactly same relative horizontal center position regardless of zoom?

    How to push content div to footer div while keeping background in the picture

    myFlowPanel has many childFlowPanels, so how to create the same margin for all childFlowPanels without using marginTop on childFlowPanels (GWT)?

    How to get the perticluar image from large set images in one image using css

    How can I know if I am clicking on a transparent or non-transparent part of a png on a web page?

    How to create a button with a CSS-animated background?

    How to create css shadow effect [duplicate]

    How to use CSS to center the buttons?

    how to position a container in the middle of the screen? [duplicate]

    how to not inherit? or how to reset inherited width to the value before? (css)