Search the Community
Showing results for tags 'footer'.
-
Hi, I am trying to make a page where the footer is loaded according to the screen size, so if someone is accessing the website via a tablet will be a footer, if it is from the computer, there will be another footer. my problem is that although it is recognizing the windows width, it is not changing the footer accordingly. this is my code: $width = "<script>document.write(window.innerWidth);</script>"; if ($width < 900) { include("footer_mobile.php"); } else { include("footer.php"); } for some reason it is always loading the else footer even though the windows with changes. I added echo"$width" ; and the result of the variable was fine. does anyone know what the problem is cause it is driving me crazy?
- 7 replies
-
- screen size
- responsive
-
(and 2 more)
Tagged with:
-
Hey guys, i am just messing around with the float property and setting up a layout with 3 columns. i am trying to tie in this column layout between a header and footer. code: <!doctype html> <html> <head> <title>Responsive Image</title> <meta charset="utf-8"> <link href="css/demo.css" rel="stylesheet" type="text/css"></link> <script> document.cookie = "device_dimensions=" + screen.width + "x" + screen.height; </script> </head> <body> <div class="header"></div> <div class="left"></div> <div class="center"></div> <div class="right"></div> <div class="footer"></div> </body> </html> and the CSS body{ margin: 0px 0px; padding: 0px 0px; } .header{ height: 50px; width: auto; background-color: gray; } .left{ height: 500px; width: 180px; margin-left: 100px; border: black 3px solid; margin-top: 20px; float:left; } .center{ height: 500px; width: 700px; border: black solid 3px; float: left; margin-top: 20px; margin-left: 20px; } .right{ height: 500px; width: 200px; border: black solid 3px; float: left; margin-top: 20px; margin-left: 20px; margin-bottom: 20px; } .footer{ height: 50px; width: auto; background-color: black; } IMAGE OF FINAL PRODUCT I want the footer to box the content ( 3 columns ) with the header. any suggestions as to why the footer is foregoing the content and sticking to the header ?
-
Hi, I'm trying to make it so when the height of the browser is more than '900' it changes the style type bottom to 0. Here's my code but it doesn't work? Thanks. <script type="text/javascript"> function changeHeightLimit() { if(window.innerHeight >= 900) { document.getElementById("footer").style.bottom="0"; } } </script>
-
- footer
- javascript
-
(and 1 more)
Tagged with: