responsive design footer placement on ipad

[drotar]

friends,
been trying to get my footer to place itself at the bottom of the iPad tablet when rotating it Portrait. no such luck. tried the sticky footer but no such luck. any ideas on how to fix this problem. the site is http://www.drotardesign.com/www.blueheavenisland.com

my css is:
footer[role=”contentinfo”] {/SENDS FOOTER TO BOTTOM OF PAGE/
background: rgba(175,233,230,.00); /* CONTROLS HEADER BACKGROUND/
margin-left: 0;
display: block;
bottom: 0px;
width: 100%;
left: 0px;
text-align: center;
background-image: url(../images/headerGraphicFooter.png);
opacity: .4;
margin-top: -50px; / negative value of footer height */
height: 50px;
clear:both;
position: absolute;
overflow:hidden;
}

html is:

<footer role=”contentinfo”>

        &lt;!--<p>terac.us | <span>918.622.6818  | fax 918.622.7719</span> </p>--&gt;

   &lt;/footer&gt;
    <div></div> &lt;!--ALWAYS KEEP THIS/KEEPS THINGS FROM BEING CUT OFF--&gt;

<!–/#inner-wrap–>
<!–/#outer-wrap–>

[Author]

Posts