AdminRoy
AdminRoy

Reputation: 105

Resize the width of the div in mobile phone

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

Answers (1)

Vladimir Rodichev
Vladimir Rodichev

Reputation: 361

@media (max-width: 767px) {
  #right {
    display: none;
  }
  #content {
    width: 100%;
    float: none
  }
}

Upvotes: 2

Related Questions