Jquery选项卡，选项卡中的文本在Chrome中溢出其边框

Question

从图像中可以看出，它显示文本溢出了标签边框。但是点击标签后，溢出就神奇地消失了。

所以基本上这个问题在加载过程中仍然存在，只在chrome ..在firefox和iE中完美地工作

有没有办法解决这个问题？我花了几个小时来调整css，但最终无济于事。

Html

<div id="tabs">
    <ul>
        <li><a href="#tabs-1">Post</a></li>
        <li><a href="#tabs-2">Draw</a></li>
        <li><a href="#tabs-3">Snapshot</a></li>
    </ul>

    <div id="tabs-1">
        <p>containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p><br>
        <p>containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p><br>
        <p>containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p><br>
    </div>

    <div id="tabs-2">
        <p>containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p><br>
    </div>

    <div id="tabs-3">
        <p>containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p><br>

    </div>
</div>

的CSS

#tabs{background: none;width:100%;}

的Javascript

<script type="text/javascript">
    $(function() {
        //tabs
        $( "#tabs" ).tabs({collapsible: true});

    });
</script>

Answer 1

我找到了解决方案，由于我调整了jquery-ui.css，这种奇怪的行为发生了。