footer wont shown after foreach loops

I try to make a simple jquery mobile page with header, ui-content and footer. I use jquery mobile 1.4.5 and jquery 2.1.3. The header and the ui-content div's works well but the footer dont become shown. I think it has something to do with this <div class="ui-content"> because when I delete these the footer become shown to the user. What make the footer in <div class="ui-content"> unshown?

    <div data-role="page" id="main">
    <div data-role="header" data-theme="a">
        <h1>lenfr</h1>
    </div>
    <div class="ui-content">
        <?php
            include("list.php");
        ?>
        <div data-demo-html="true">
            <ul data-role="listview" data-inset="true" class="ui-listview ui-listview-inset ui-corner-all ui-shadow">
                <?php foreach ($result as $key => $row): ?>
                <li id ="listone" name="listone"  data-role="list-divider" role="heading" class="ui-li ui-li-divider ui-bar-b ui-li-has-count ui-first-child"><?php echo $row['date']; ?></li>
                    <li data-corners="false" data-shadow="false" data-iconshadow="true" data-wrapperels="div" data-icon="arrow-r" data-iconpos="right" data-theme="a" >
                    <div class="ui-btn-inner ui-li"><div class="ui-btn-text"><a class="ui-link-inherit"></a><p class="ui-li-aside ui-li-desc"><strong></strong><?php echo $row['time']; ?></p>
                        <p class="ui-li-desc"><strong><?php echo $row['title']; ?></strong></p>
                        <p class="ui-li-desc"><?php echo $row['text']; ?></p>

                        <p class="ui-li-desc"><strong><?php echo $row['town']; ?></strong></p> 
             <a class="commentbtn" data-rel="button" >comment</a>   
            <div style="width:25%" id="createcomment" class="comment" data-theme="a" >
    <form data-ajax="false" name="login-form" class="login-form" action="./comments.php" method="post" style="padding:20px 40px;">
        <div class="content">
        <div id="showcomments" data-theme="a" >
    <?php
include("showcomments.php");
?>
    <?php foreach ($comments as $keyComment => $rowComment): ?>
    <div>
    <p class="ui-li-desc"><strong><?php echo $rowComment['username']; ?></strong></p>
                        <p class="ui-li-desc"><?php echo $rowComment['comment']; ?></p>
                        </div>
                <?php endforeach; ?>
</div>
         <input type="hidden" name="id" id="id" value="<?php echo $row['id']; ?>" type="text" />
         <input type="hidden" name="autorpost" id="autorpost" value="<?php echo $row['autor']; ?>" type="text" />      
        </div>
        <div class="ui-grid-a">
        <div class="ui-block-a"><textarea rows="1" name="text" id="text" class="foo"></textarea></div>
         <div class="ui-block-b"><input type="submit" name="submit" data-icon="carat-r" value="comment" class="button" data-theme="a"/></div>       
        </div>  
    </form>
</div>

                    </li>

        <?php endforeach; ?>
                    <!-- foreach content -->
            </ul>
        </div>
    </div> <!-- end ui-content -->
</div> <!-- end page -->
</div> <!-- stray div tag -->
<div data-role="footer" data-id="footernav" data-tap-toggle="false" data-position="fixed" data-theme="a">
    <div data-role="navbar" data-theme="a">
        <ul>
            <li><a href="#own posts" data-icon="comment" data-transition="fade">own posts</a></li>
            <li><a href="#main" data-icon="bars" data-transition="fade" class="ui-btn-active">main</a></li>
            <li><a href="#create post" data-icon="plus" data-transition="fade">create post</a></li>
        </ul>
    </div>
    <!-- /navbar -->
</div><!-- /footer -->
</div><!-- /page -- this /div is also obsolete since page is closed above -->

Answers


After checking your code I see you have two stray div tags I pointed out in comments below:

<!-- main Seite -->
<div data-role="page" id="main">
    <div data-role="header" data-theme="a">
        <h1>lenfr</h1>
    </div>
    <div class="ui-content">
        <?php
            include("list.php");
        ?>
        <div data-demo-html="true">
            <ul data-role="listview" data-inset="true" class="ui-listview ui-listview-inset ui-corner-all ui-shadow">
                <?php foreach ($result as $key => $row): ?>
                    <!-- foreach content -->
                <?php endforeach; ?>
            </ul>
        </div>
    </div> <!-- end ui-content -->
</div> <!-- end page -->
<!-- </div> --> <!-- stray div tag -->
<div data-role="footer" data-id="footernav" data-tap-toggle="false" data-position="fixed" data-theme="a">
    <div data-role="navbar" data-theme="a">
        <ul>
            <li><a href="#own posts" data-icon="comment" data-transition="fade">own posts</a></li>
            <li><a href="#main" data-icon="bars" data-transition="fade" class="ui-btn-active">main</a></li>
            <li><a href="#create post" data-icon="plus" data-transition="fade">create post</a></li>
        </ul>
    </div>
    <!-- /navbar -->
</div><!-- /footer -->
<!-- </div> --><!-- /page -- this /div is also obsolete since page is closed above -->

One div element was out of its <li>

<div data-role="page" id="main">

<div data-role="header" data-theme="a">
    <h1>lendt</h1>

  </div>


    <div class="ui-content">                 
<?php
include("list.php");
?>

    <div data-demo-html="true">
                <ul data-role="listview" data-inset="true" class="ui-listview ui-listview-inset ui-corner-all ui-shadow">

                <?php foreach ($result as $key => $row): ?>

                    <li id ="listone" name="listone"  data-role="list-divider" role="heading" class="ui-li ui-li-divider ui-bar-b ui-li-has-count ui-first-child"><?php echo $row['date']; ?></li>
                    <li data-corners="false" data-shadow="false" data-iconshadow="true" data-wrapperels="div" data-icon="arrow-r" data-iconpos="right" data-theme="a" >
                    <div class="ui-btn-inner ui-li"></div><div class="ui-btn-text"><a class="ui-link-inherit"></a><p class="ui-li-aside ui-li-desc"><strong></strong><?php echo $row['time']; ?></p>
                        <p class="ui-li-desc"><strong><?php echo $row['title']; ?></strong></p>
                        <p class="ui-li-desc"><?php echo $row['text']; ?></p>

                        <p class="ui-li-desc"><strong><?php echo $row['town']; ?></strong></p> 
             <a class="commentbtn" data-rel="button" >comment</a>   
            <div style="width:25%" id="createcomment" class="comment" data-theme="a" >
    <form data-ajax="false" name="login-form" class="login-form" action="./comments.php" method="post" style="padding:20px 40px;">
        <div class="content">
        <div id="showcomments" data-theme="a" >
    <?php
include("showcomments.php");
?>
    <?php foreach ($comments as $keyComment => $rowComment): ?>
    <div>
    <p class="ui-li-desc"><strong><?php echo $rowComment['username']; ?></strong></p>
                        <p class="ui-li-desc"><?php echo $rowComment['comment']; ?></p>
                        </div>
                <?php endforeach; ?>
</div>
         <input type="hidden" name="id" id="id" value="<?php echo $row['id']; ?>" type="text" />
         <input type="hidden" name="autorpost" id="autorpost" value="<?php echo $row['autor']; ?>" type="text" />      
        </div>
        <div class="ui-grid-a">
        <div class="ui-block-a"><textarea rows="1" name="text" id="text" class="foo"></textarea></div>
         <div class="ui-block-b"><input type="submit" name="submit" data-icon="carat-r" value="comment" class="button" data-theme="a"/></div>       
        </div>  
    </form>
</div>
</div>
                    </li>

        <?php endforeach; ?>



</ul>


</div>
</div>


    <div data-role="footer" data-id="footernav" data-tap-toggle="false" data-position="fixed" data-theme="a">
        <div data-role="navbar" data-theme="a">
            <ul>
                <li><a href="#own posts" data-icon="comment" data-transition="fade">own posts</a></li>              
                <li><a href="#main" data-icon="bars" data-transition="fade" class="ui-btn-active">main</a></li>
                <li><a href="#create post" data-icon="plus" data-transition="fade">create post</a></li>
            </ul>
        </div><!-- /navbar -->       
    </div><!-- /footer -->            
</div><!-- /page -->

Need Your Help

Wordpress posts polluted, how to prevent it?

wordpress security

I have a simple Wordpress website for a local fitness club http://atanas-georgiev.com/ . I recently decided to check it out and see if anything is broken unfortunately its posts was hijacked with

How to get a list of all available servlets?

java servlets

Is it possible to get a list of all available servlets in an app?