CODEWITHSUNDEEP
htmlcssautoresizeflexbox
vzhen
vzhen

Reputation: 11157

Dynamic width div auto resize to fit browser width?

I have several div with unknown width(dynamic width). How can I auto resize these div to fit browser width?

For example, I have 5 div with difference width. If the browser width only able to fill up 3 div then those 3 div will auto resize to fit the browser width and the rest will display at second row.

How can I make it using html5 and css3. I know that a new feature flexbox in css3 but i am not sure whether I can deal with it.

Upvotes: 2

Views: 2875

Answers (1)

yossi
yossi

Reputation: 1431

You can play with the calss - value acording your request. min/max width/height

see example demo jsFiddle

    .grid {
  display: box;
  display: -webkit-flex;
  display: flex;
}
.column {
  padding: 20px;
}
.fluid {
  box-flex: 1;
  background: #ccc;
}
.fixed {
    width: 100px;
  background: red;
}​

Upvotes: 2

Related Questions