css container query

Discussion in 'HTML' started by Tom, Apr 25, 2004.

  1. Tom

    Tom Guest

    Hi
    I want to have a container around 2 columns with a background image. In IE
    the container expands depending on the content but in Mozilla I seem to have
    to specify the height of the div to be able to see it... you will notice
    that it looks ok in IE but the background image is not showing in Mozilla
    I have done similar before and it worked fine but there seems to be a
    problem now.
    Link is http://www.lightbox.ie/test/
    If anyone had any thoughts it would be great... basically I want the div
    with id of mcc to expand as the divs leftcontent and rightcontent expand...
    Thanks in advance
    Tom
    Tom, Apr 25, 2004
    #1
    1. Advertising

  2. Tom

    GD Guest

    Tom <> wrote:
    > I want to have a container around 2 columns with a background image.


    If you've floated the left and right columns then the containing block
    will collapse to fit the remaining content. If the floated columns are
    the only thing in the container then it will collapse to zero-height.

    To make it expand to fit the floated columns you need to put something
    after them and use the CSS clear property (its values can be 'left',
    'right' or 'both'). Example:


    <div style="border:black solid 1px;">
    <p style="float:left; width:50%;">Floated left</p>
    <p style="float:right; width:50%;">Floated right</p>
    <p style="clear:both;><a href="#top">Back to top of page</a></p>
    </div>
    GD, Apr 25, 2004
    #2
    1. Advertising

  3. Tom

    Richard Guest

    Tom wrote:

    > Hi
    > I want to have a container around 2 columns with a background image. In
    > IE the container expands depending on the content but in Mozilla I seem
    > to have to specify the height of the div to be able to see it... you will
    > notice that it looks ok in IE but the background image is not showing in
    > Mozilla I have done similar before and it worked fine but there seems to
    > be a problem now.
    > Link is http://www.lightbox.ie/test/
    > If anyone had any thoughts it would be great... basically I want the div
    > with id of mcc to expand as the divs leftcontent and rightcontent
    > expand... Thanks in advance
    > Tom



    Try my solution. http://1-large-world.com/samples/sample1.html
    http://1-large-world.com/samples/sample2.html

    Place your menu links inside the "header" division as well as your banner.
    Use the "sidebar" division as desired.
    Or not at all and add your graphics into another division using
    "float:left;".
    Richard, Apr 26, 2004
    #3
  4. Tom

    Tom Guest

    > If you've floated the left and right columns then the containing block
    > will collapse to fit the remaining content. If the floated columns are
    > the only thing in the container then it will collapse to zero-height.
    >
    > To make it expand to fit the floated columns you need to put something
    > after them and use the CSS clear property (its values can be 'left',
    > 'right' or 'both'). Example:
    >


    Thanks
    That sorts it out... had problems with the clear properties before...
    Tom, Apr 26, 2004
    #4
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Vivi Orunitia
    Replies:
    11
    Views:
    4,448
    Martijn Lievaart
    Feb 4, 2004
  2. Maitre Bart
    Replies:
    2
    Views:
    510
    Maitre Bart
    Feb 11, 2004
  3. Steven T. Hatton
    Replies:
    4
    Views:
    3,871
    Rob Williscroft
    Dec 5, 2004
  4. Replies:
    4
    Views:
    784
    Daniel T.
    Feb 16, 2006
  5. wolverine
    Replies:
    2
    Views:
    438
    Marcus Kwok
    Jul 24, 2006
Loading...

Share This Page