CODEWITHSUNDEEP
css
user784637
user784637

Reputation: 16142

How to set a minimum width in px and a maximum width based on the variable width of the browser window?

In this example:

http://jsbin.com/anoyik/edit#preview

http://jsbin.com/anoyik/edit#source

How can I set the red box's width to at least 200px and have it continue to expand in width as the browser window's width is extended horizontally?

Upvotes: 0

Views: 246

Answers (2)

0b10011
0b10011

Reputation: 18795

Expand both boxes

http://jsbin.com/anoyik/5/edit#preview

Expand only red box

http://jsbin.com/anoyik/7/edit#preview

Upvotes: 0

nicjohnson
nicjohnson

Reputation: 604

This should do it for you: http://jsbin.com/exunik/2

The thing that keeps the black red box from expanding is that you had it set to inline-block. I added a min-width to the red box and set it to display: block. Then I floated the red box to the left to cause the black one to move into place on its right.

Upvotes: 2

Related Questions