Confusion with max-width and min-width

HTML & CSS
1

I have two inline-blocks with their own max/min-width. I want them to respond to with the width of the wrapper they are contained in, which changes depending on browser window size. However right now these two inline-blocks automatically adjust to the min-width size and that’s it.

Now, if I change them to “block” they adjust in size properly but they are no longer inline. Any suggestions on what I may be doing wrong or how to best address this?

http://estevancarlos.kodingen.com/dadev1/
http://estevancarlos.kodingen.com/dadev1/holidayhq-landingpage.css

2

You are probably better off using % widths in that case. Make sure to design these columns along with the whole page, so that things are all in harmony. Set a max and min width for the page container and work your way in from there.

3

Regarding the issue, are you recommending % widths because it’s easier or because it’s the only option? I just want to make sure I understand what’s at hand.

4

It’s not the only option, but the best one I’m aware of. You could also use display: table &co, but I don’t find that’s a very good option for page layout.

5

The thing to know here inline elements cant have dimensions. You will need to float the elements or use display:inline-block;

as has been said before, you will find that it makes more sense to apply min/max width on the container.

hope that helps