IE7问题与DIV,子div宽度取自父级

时间:2012-09-19 22:21:14

标签: html internet-explorer-7 width

IE7与DIV一起出现问题,孩子的div宽度取自父母!它在IE9中工作正常,但IE7显示垂直堆叠的子div和父div的100%宽度。 IE9显示子div首先水平堆叠,然后根据需要堆叠到第二行,并且它们是子宽度的100%,具体取决于内容。

<style type="text/css">
    body {
        margin-left: 0px;
        margin-top: 0px;
        margin-right: 0px;
        margin-bottom: 0px;
        padding-left: 0px;
        padding-top: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        background-image: url(/CIRCUITS/framework/Images/masterpagedefault/bg_texturedphoto.jpg);
        background-repeat: repeat;
    }
    .menuItems 
    {
        list-style-image: none;
        list-style-type: none;
        padding:5px 10px 10px 10px;
        margin: 0px 0px 0px 0px;
    }
    .menuItemHeader {
        background-color: #272727;
        padding: 5px 20px 5px 5px;
        margin: 10px 10px 0px 10px;
        font-family: Arial;
        font-size: 11px;
        font-weight: bold;
        color: white;
        text-align: left;
        border-top: 1px;
        border-left: 1px;
        border-bottom: 0px;
        border-right: 1px;            
        border-style: solid;
        border-color: #666;
    }
    .menuItemHeader2 {
        background-color: #272727;
        padding: 5px 5px 5px 5px;
        margin: 0px 0px 0px 0px;
        font-family: Arial;
        font-size: 11px;
        font-weight: bold;
        color: white;
        text-align: left;
        border-top: 1px;
        border-left: 1px;
        border-bottom: 0px;
        border-right: 1px;            
        border-style: solid;
        border-color: #333;
    }
    .menuItemContainer2 {
        background-image: url(/CIRCUITS/framework/Images/masterpagedefault/dropshadow.png);
        background-repeat: repeat;
        padding: 5px 5px 5px 5px;
        margin: 0px 0px 0px 0px;
        font-family: Arial;
        font-size: 11px;
        font-weight: bold;
        color: white;
        text-align: left;
        border: 1px;
        border-style: solid;
        border-color: #333; 
        vertical-align:top;
    }
    .menuItemContainer {
        background-color: #333;
        padding: 0px 0px 0px 0px;
        margin: 0px 10px 0px 10px;
        font-family: Arial;
        font-size: 11px;
        font-weight: bold;
        color: white;
        text-align: left;
        border: 1px;
        border-style: solid;
        border-color: #666;
    }
    .menuFramework2 {
         background-image: url(/CIRCUITS/framework/Images/masterpagedefault/HSubmenuBG.png);
         border-top: none;
         border-left: solid;
         border-left-color: black;
         border-left-width: 1px;
         border-bottom: solid;
         border-bottom-color: black;
         border-bottom-width: 1px;
         border-right: solid;
         border-right-color: black;
         border-right-width: 1px;
         visibility: hidden;
         position: absolute;
         top: 10px;
         font-family: Arial, Helvetica, sans-serif;
         font-size: 10px;
         color: white;
    }
    .menuFramework {
         background-image: url(/CIRCUITS/framework/Images/masterpagedefault/HSubmenuBG.png);
         border-top: none;
         border-left: solid;
         border-left-color: black;
         border-left-width: 1px;
         border-bottom: solid;
         border-bottom-color: black;
         border-bottom-width: 1px;
         border-right: solid;
         border-right-color: black;
         border-right-width: 1px;
         visibility: hidden;
         position: absolute;
         font-family: Arial, Helvetica, sans-serif;
         font-size: 10px;
         color: white;
    }
    .MainMenu {
         background-image: url('/CIRCUITS/framework/Images/masterpagedefault/dropshadow.png');
         border-top-width: 0px; 
         border-left: 2px solid transparent;
         border-bottom: 2px solid transparent;
         border-right: 2px solid transparent;
         visibility: hidden; 
         position: absolute;
         width: 1009px;
         font-family: Arial, Helvetica, sans-serif;
         font-size: 10px;
         color: white;
         padding: 0px 0px 0px 0px;
         margin: 0px 0px 0px 0px;
         top: 55px;
    }
    .menulinks {
         font-family: Arial, Helvetica, sans-serif;
         font-size: 11px;
         color: white;
         outline: none;
         text-decoration: none;
    }
    a {
         font-family: Arial, Helvetica, sans-serif;
         font-size:12px;
         color: white;
         outline:none;
     }
     a:link {
         text-decoration: none;
         outline:none;
     }
     a:visited {
         text-decoration: none;
         color: white;
         outline:none;
     }
     a:hover {
         text-decoration: none;
         color: #99ccff;
         outline:none;
     }
     a:active {
         text-decoration: none;
         outline:none;
     }
</style>
<script language="javascript" type="text/javascript">
    function MM_preloadImages() { //v3.0
        var d = document; if (d.images) {
            if (!d.MM_p) d.MM_p = new Array();
            var i, j = d.MM_p.length, a = MM_preloadImages.arguments; for (i = 0; i < a.length; i++)
                if (a[i].indexOf("#") != 0) { d.MM_p[j] = new Image; d.MM_p[j++].src = a[i]; }
        }
    }
    function On(objMenuButton, objMenu, TopOffset, LeftOffset, imgButton) {
        if (objMenu.style.visibility == "visible") {
            return;
        }
        //alert(document.getElementById("divER").style.clientLeft);
        //alert(document.getElementById("divER").clientLeft);
        //return;
        //alert(objMenuButton.offsetTop);
        objMenu.style.visibility = "visible";
        //objMenu.style.left = (objMenuButton.offsetLeft + LeftOffset) + "px";
        //alert(objMenu.offsetLeft);
        //alert(objMenu.style.bottom);
        //objMenu.style.top = (objMenuButton.offsetTop + objMenuButton.offsetHeight + TopOffset) + "px";
        //this.divER.style.left.
        //alert("bot:" + (parseInt(ImgHeight) + parseInt(TopOffset) + 0));
        //alert(objMenuButton.style.height);
        //alert(objMenu.style.left);
        //alert(objMenuButton.offsetLeft);
        imgButton.src = "/CIRCUITS/framework/Images/masterpagedefault/HMenuUA_On.png";
    }
    function Off(objMenu, imgButton) {
        //alert(event.srcElement.id + " " + objMenu.id);
        //alert(objMenu.id);
        imgButton.src = "/CIRCUITS/framework/Images/masterpagedefault/HMenuUA.png";
        objMenu.style.visibility = "hidden";
    }
</script>
                                                                                                                                                                                                                                                                                                                                       UA菜单小大最大testryareyareyaetuyateru                                                                       
  • 菜单项小
  •                         
  • 菜单项目二
  •                         
  • 菜单项目3
  •                         
  • 菜单项目四
  •                         
  • 菜单项目五
  •                         
  • 菜单项目六
  •                                                                                                     UA菜单小型最大的ateru                                                                       
  • 菜单项小
  •                         
  • 菜单项目二
  •                         
  • 菜单项目3
  •                         
  • 菜单项目四
  •                         
  • 菜单项目五
  •                         
  • 菜单项目六
  •                                                                                                     UA菜单小大的最大的aterudfhs dfhdfhdfh dahfh dfh afd a df hh                                                                       
  • 菜单项小
  •                         
  • 菜单项目二
  •                         
  • 菜单项目3
  •                         
  • 菜单项目四
  •                         
  • 菜单项目五
  •                         
  • 菜单项目六
  •                                                                                                     UA菜单小型最大的ateru                                                                       
  • 菜单项小
  •                         
  • 菜单项目二
  •                         
  • 菜单项目3
  •                         
  • 菜单项目四
  •                         
  • 菜单项目五
  •                         
  • 菜单项目六
  •                                                                                                     UA菜单小型最大的ateru                                                                       
  • 菜单项小
  •                         
  • 菜单项目二
  •                         
  • 菜单项目3
  •                         
  • 菜单项目四
  •                         
  • 菜单项目五
  •                         
  • 菜单项目六
  • 0 个答案:

    没有答案