Javascript JQuery mobile listview项是否超出边界？

我正在使用jQuery mobile作为界面构建一个网页。我遇到了这个问题：listview ul没有遵循我在projectlisting id上设置的样式，它超出了边界

页面末尾的脚本仅用于将content div扩展到全屏

这是我的html代码

<div class="content" data-role="content">
    <div id="projectlisting">
        <div data-role="header" data-theme="e">
            <h5>Project list</h5>
        </div>
        <div id="wrapper_projectlist">
            <ul id="projectlist" data-role="listview" data-filter="true" data-split-theme="c">
                <li>
                    <a href="#" data-value="1" data-name="name" class="project-action">Project 1</a>
                    <a href="#" data-value="1" data-name="name" class="project-action"></a>
                </li>
            </ul>           
        </div>
    </div>

    <div id="projectperson">
    </div>

    <div id="personlisting_assign">
    </div>
</div>
<script type="text/javascript">
    var selectedProjectId = Number.NaN;
    var selectedPersonId = Number.NaN;

    function setDimensionsForProjectPerson() {
        var h = $(window).height() - $(".mainheader").outerHeight() - $(".mainfooter").outerHeight();
        $(".content").css("height", h);
    }

    $(document).ready(function() {
        setDimensionsForProjectPerson();
        $(window).resize(setDimensionsForProjectPerson);
        window.onorientationchange = setDimensionsForProjectPerson;
    }); 
</script>

你能解释一下为什么这个列表打破了界限，并告诉我如何解决这个问题吗。

---

提前感谢。

添加此$'wrapper\u projectlist'。查找'form，ul'。css'margin'，0；它会起作用的。因为表格和保险商实验室的保证金为：-15。通过删除边距，两者都将适合div。嗨，它工作得很好，但是当我单击li项时，一些看不见的东西将边框推开了。你能告诉我如何解决这个问题吗？你在哪个浏览器/设备上遇到这个问题？使用chrome在fiddle上很好。嗨，我用的是Firefox。我试过小提琴，它也有同样的问题。

#projectlisting, #projectperson, #personlisting_assign {
    outline: 1px solid grey;
    float: left;
    height: 100%;
    width: 33%;
}

/* used where the project list is displayed, under #projectlisting div */
#wrapper_projectlist {
    position: relative;
    width: 100%;
    z-index: 1;
}