Small devices (landscape phones, 576px and up)
@media (min-width: 576px) {
#my-content{
width:100%;
}
// Medium devices (tablets, 768px and up)
@media (min-width: 768px) {
#my-content{
width:100%;
}
}
// Large devices (desktops, 992px and up)
@media (min-width: 992px) {
display: none;
}
// Extra large devices (large desktops, 1200px and up)
@media (min-width: 1200px) {
// Havent code only get for more informations
}
It sounds like you may be wanting to access the viewport of the device. You can do this by inserting this meta tag in your header.
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Source: Stackoverflow.com