Reputation: 105
I have two divs. One is 15%, and the other is 76%. I want to hide the 16% div on mobile phones. That is being achieved using this.
class="navbar hidden-xs"
And the code is as follows
#right {
top: -1px;
position: fixed;
background: blue;
width: 15%;
}
However, when I change the screen size, the box is getting hidden but the space remains there. I want to make the width of the content to 100% in mobile-only. How can I achieve this? My code for the content is as follows:
#content {
float: right;
width: 76%;
}
Upvotes: 1
Views: 1033
Reputation: 361
@media (max-width: 767px) {
#right {
display: none;
}
#content {
width: 100%;
float: none
}
}
Upvotes: 2