Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jul 2011
    Posts
    9
    Thanks
    2
    Thanked 0 Times in 0 Posts

    sticking footer placement

    Hello kind people,

    I do have got a little page I created because of a game.
    I'm having the problem, the footer div slips into the nonfooter body div on my Android phone with Opera Mobile and built-in if the screen orientation is landscape.
    The temporary solution is that I set a margin on the bottom that equals the height of the footer. In landscape it looks good, but in portrait it's too long.
    Here is the source(contains php): link: http://v.gd/igreh
    Code:
    <?php
    @date_default_timezone_set('Europe/Budapest');
    require_once dirname(__FILE__)."/phpfreechat-1.3/src/phpfreechat.class.php";
    $params = array();
    $params["title"] = "Hunter talk";
    $params["nick"] = "hunter".rand(1,1000);
    $params["serverid"] = md5(__FILE__);
    $params["max_channels"] = 1;
    $params["admins"] = array('Igreh'  =>  '#########');
    $params["display_pfc_logo"] = false;
    $params["max_msg"] = 5;
    $params["skip_proxies"] = array('censor');
    $chat = new phpFreeChat( $params );
    ?>
    
    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="X-UA-Compatible" content="IE=7" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Igreh's place</title>
    <style type="text/css">
    .rightborder {
    border-right: 1px solid #000000;
    }
    
    .leftborder {
    border-left: 1px dashed #000000;
    }
    
    html, body { 
    height:100%;
    background-color:#DEDFD1;
    margin-bottom: 0;
    } 
    #non-footer { 
    min-height:100%; 
    padding-bottom: 420px;
    } 
    * html #non-footer { 
    height:100%; 
    } 
    #footer { 
    height:420px; 
    margin-top:-420px; 
    }
    </style>
    <script type="text/javascript">
    function understood() {
    document.getElementById("board").innerHTML = '\n<iframe frameborder="0" scrolling="no" src="../ideabox/index.php" style="width:100%; height:100%;"> Error: Embedded data could not be displayed. <a href="../ideabox/">CLICK HERE</a> to open the forum.</iframe>';
    document.getElementById("span").innerHTML = '<span style="cursor: pointer; color: blue;" onClick="javascript:understood();"><u>Refresh board</u></span>';
    }
    </script>
    </head>
    <body>
    <div id="non-footer">
    <center><table border=0 cellspacing=0 cellpadding=0><tr><td><img src="logo.png" width="96" height="156"></td><td valign=middle><strong><font size=20 style="text-shadow: 0.15em 0.15em 0.3em #333; padding: 0 20px;">Igreh's place</font></strong></td><td><img src="logo.png" width="96" height="156"></td></tr></table></center><br><hr><br>
    <table border=0 style="width: 100%; height: 100%;"><tr>
    <td rowspan="2"><?php $chat->printChat(); ?></td>
    <td class="rightborder" rowspan="2"></td><td rowspan="2" class="leftborder"></td>
    <td align="center" style="text-shadow: 0.1em 0.1em 0.1em #FFF; width: 450px;">View bulletin board<br><div id="span"></div><hr></td></tr>
    <tr>
    <td id="board" align="center" valign="middle" style="text-shadow: 0.1em 0.1em 0.1em #FFF;">Here you can leave messages for me or everyone else.<br>Helpful infos can posted as well and are welcome =)<br>
    Please do not use bad language or do not hurt anyone's feelings<br><br>But be careful!<br>Maybe there is some fool breaking such simple rules<br><br>
    <span style="cursor: pointer; text-decoration: underline;" onClick="javascript:understood();">Understood!</span>
    </td>
    </tr></table></div>
    <div id="footer" style="background-image:url('back.png'); background-repeat:no-repeat; width: 501px; height: 420px;"></div>
    </body>
    </html>
    Without margin-bottom: 420px



    With margin-bottom: 420px

    Last edited by Adolf1994; 09-16-2011 at 12:25 AM.

  • #2
    New to the CF scene
    Join Date
    Jul 2011
    Posts
    9
    Thanks
    2
    Thanked 0 Times in 0 Posts
    I'm soooo happy I found this site: http://www.cssstickyfooter.com/


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •