0

As the title explains, I have one container div, containing two floating divs of varying widths. See it in action here (it's the "Hotel booking" part):

http://experiencerapanui.com/book_hotel.php?hotel_id=3

I bordered the 2nd div for you. I need this 2nd div to fill out all the remaining space of the container div. I cannot fix the width of the first div, since the width of it varies depending on what the different hotels offer, but I still want the 2nd div (where the prices will appear) to fill out all the remaining space, to not make it so cramped.

How is this result achieved?

mskfisher
  • 3,291
  • 4
  • 35
  • 48
Marcus Edensky
  • 924
  • 3
  • 13
  • 33
  • 4
    Can you put the pertinent code into this question? Without it, this question won't be useful to anyone else once you've resolved the issue on your live site. – KatieK Jun 22 '11 at 00:10

1 Answers1

3

On your "bordered div", remove float: left and add overflow: hidden.

For a demo and explanation, see: Fill the space of a div

I just checked your page with IE. You don't have a doctype, so your page is hopelessly broken thanks to Quirks Mode.

Resolve this second problem by adding this (the HTML5 doctype) as the very first line of your HTML:

<!DOCTYPE html>
Community
  • 1
  • 1
thirtydot
  • 224,678
  • 48
  • 389
  • 349
  • At last, a solution that works! Works perfectly, thanks a lot! And about the doctype, I've been wondering about IE acting strange =), thanks again! – Marcus Edensky Jun 22 '11 at 07:04