Grow your CSS skills. Land your dream job.

DIV Width Not Expanding To Fit Width Of Child DIV – IE7

  • # October 21, 2009 at 10:37 am

    I have a page with an ASP.NET Gridview on it…this Gridview is located in a child DIV inside a parent DIV. That Gridview can often go wider than the parent DIV width set. In IE6 the MAINDIV (Parent DIV) would expand to fit the expanded Gridview contained within the child DIV. In IE7 the DIV will not expand so it overlaps the DIV and looks bad. I want that MainDiv to dynamically grow with the child DIV width, like it did in IE6.

    Please see my code below. I want the MainDiv to remain ~800px unless it is pushed out further.

    Thanks for any ideas on a fix for this. Whenever I try min-width it just blows the parent DIV out to 100% screen size.

    Code:
    < %@ Master Language="VB" CodeFile="themaster.master.vb" Inherits="themaster" %>
    < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">



    # October 21, 2009 at 1:26 pm

    The first thing I notice is all your widths are set to 800px and 797px.

    I was going to suggest min-width till i read the last line. Try this:

    make your mainDiv with no width. However, add padding to the mainDiv. This will cause the main div to auto fit to your child div and add the spacing around the divs.

    <div id="mainDiv" style="position:relative;top:10px;padding: 5px;height:auto; background-color:white;border:solid 1px #666666">

    # October 21, 2009 at 3:13 pm

    If I don’t include a width it takes up 100% screen size

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".