如何强制fieldset的宽度小于子元素的在chrome中使用jquery？

当我必须使字段集的宽度小于其子元素的宽度时，chrome和firefox将不会听我，而Internet Explorer会强制字段集的宽度。如何强制fieldset的宽度小于子元素的在chrome中使用jquery？

这是我的html代码。

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <script src="/Common/Scripts/jquery-1.9.1.min.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $(".full").each(function() { 
       $(this).siblings().each(function() { 
        $(this).width(500); 
       }); 
      }); 
      console.log($("#abc").width()); 
      console.log($("#def").width()); 
     }); 
    </script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
     <fieldset id="abc"> 
      <legend>fieldset 1</legend> 
      <div style="width:600px;overflow:hidden;"></div> 
     </fieldset> 
     <fieldset id="def" style="width:500px;"> 
      <legend>fieldset 2</legend> 
     </fieldset> 
     <span class="full"></span> 
    </div> 
    </form> 
</body> 
</html>

铬

enter image description here

的Internet Explorer

enter image description here

来源

2014-09-06 Joshua Son

你可以给小提琴还与CSS？ – reyaner 2014-09-06 11:26:14

@reyaner没有额外的CSS，你可以看到。你可以在http://jsfiddle.net/pmmwmdLw/2/ – 2014-09-06 12:15:50

看到结果是将'div'设置为'position：absolute;'给你一个解决方案吗？ – reyaner 2014-09-06 12:57:10

我不认为这会工作，然后。

你能做的最好的，是把一个第二个div作为包装，并设置了宽度......

<fieldset id="abc"> 
    <legend>fieldset 1</legend> 
     <div class="wrap" style="overflow:hidden;"> 
      <div style="width:600px;overflow:hidden;"></div> 
     </div> 
</fieldset>

然后：

$(this).siblings().each(function() { 
    $(this).width(500).find("div.wrap").width(500); 
});

你也可以创建包格与jQuery ...

来源

2014-09-06 13:50:35 reyaner

如何强制fieldset的宽度小于子元素的在chrome中使用jquery？

回答

相关问题