www.webdeveloper.com
Results 1 to 4 of 4

Thread: How is this media query getting overidden?

  1. #1
    Join Date
    Mar 2014
    Posts
    3

    How is this media query getting overidden?

    Hi. First post. I'm new to responsive coding. The following two grids each use the same bootstrap.min.css file but perform differently when you minimize the screen. I want to make the second one perform like the first. So, when minimizing, the elements should nicely wrap under each other and the element(s) width should increase to 100%.

    In the second one, it seems the "@media (min-width: 992px)" is somehow being overidden. When the screen is under 992px the "float:left" and width percentage styles remain the same as if the screen is over 992px. But I don't know how to find EXACTLY where any overiding is done.

    Any suggestions? Or perhaps better how do I diagnose for myself in the future. Firebug doesn't even show the @media query, and both firefox and chrome only reference bootstrap.min.css, though I'm figuring it must be getting written over in another file.


    http://htmlstream.com/preview/unify/feature_grid.html


    http://198.74.61.72/themes/preview/ace/grid.html


    Thanks.

  2. #2
    Join Date
    Mar 2014
    Posts
    3
    So, no thoughts? Anyone?

  3. #3
    Join Date
    Feb 2013
    Posts
    87
    I know this is probably a stupid question, but why do you want to use two different grid systems? Personally I would you just one grid system per page, that way it would save you headaches. However, using two should be doable, all you have to do is make sure you have no naming conflicts with your classes and CSS properties don't conflict with each other.

  4. #4
    Join Date
    Mar 2014
    Posts
    3
    Hi. Maybe I wasn't clear above. I don't want to use two grids. I just want to make the second one perform like the first. That is, when minimized, I want the elements to nicely wrap under each other and the element width to increase to 100%. They are using the same bootstrap.min.css file so I'm trying to figure out what it is that causes their behavior to be different. There seems to be something overiding the media queries in the second one causing them to be ignored maybe? Any thoughts?

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles