James Hayes James Hayes - 3 months ago 7
CSS Question

I want the floating left <DIV>s to adjust width on mobile devices

Can any one tell why the width is NOT adjusted to 48% as the screen size changes? Is it because i have used position as relative?

.wrap {
width:24%;
background:white;
margin: 15px;
padding:10px;
float: left;
display: inline-block;
overflow:hidden;
position: relative;
}

@media(max-width: 580px){
width:48%;
}

Answer

Seems like you just forgot the .wrap and curly braces in the media query:

@media(max-width: 580px) {
  .wrap {
    width:48%;
  }
}
Comments