Responsive grid not adapting to screen sizes. How do I call the script?

问题

I am back here again with another question for responsive grid systems. I have this website http://www.waldenservices.com that uses The Responsive Grid system with various columns, I have CSS codes for 1024, 768 and 480. I am definitely inserting the css scripts on the page but I am not sure of the jQuery/java code I need to make it work.

My questions are: What script do i need to call these css styles?

And, Does these help me to detect the screen size of the user? (I think web browser size is one is my biggest concern, as different users cannot see the whole page but have to scroll from side to side to even see the whole menu). Any help or input is very appreciated, I really don't want to have to redesign this whole page.

Thank you guys!

回答1:

You don't even need to call script (I don't know what you meant by it), you just need responsive stylsheet.

All you need:

@media screen and (min-width: 1024px) {
  .col-5 {
    width: 50%;
  }
}

• @media is CSS @ rule, used for media queries.
• screen means these styles are just for screens, not for printers, or for presentations.
• (min-width: value) and (max-width: value) are used to specify minumum or maximum screen size on which these styles will apply. You can combine (min-width) and (max-width).

Whenever, if you have problems with coding responsive grid systems, you can start using a framework (e.g. Bootstrap).

来源：https://stackoverflow.com/questions/21002450/responsive-grid-not-adapting-to-screen-sizes-how-do-i-call-the-script