Page 1 of 2

footer help

Posted: Wed Nov 02, 2011 12:27 pm
by ebgames56
Just wondering is there a way to make text and images not pass my footer. Like a way to keep the footer at the bottem and not have content go past the footer

Re: footer help

Posted: Wed Nov 02, 2011 12:46 pm
by manohoo
Your solution might require CSS.
You can have your footer always at the bottom. Assume that you footer looks like this:

Code: Select all

<div id='footer'> 
   footer content
</div>
in CSS do this:

Code: Select all

#footer {
   position: absolute; 
   bottom:0px;
}

Re: footer help

Posted: Wed Nov 02, 2011 12:48 pm
by ebgames56
this is all my CSS i have that already

Code: Select all

h1 {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:16px;
font-weight:bold;
margin:0;	
padding:0;
	}

hr {
border: 0;
color: white;
background-color: white;
height: 1px;
width: 100%;
text-align: left;
}

IMG.logo {
    display: block;
    margin-left: auto;
    margin-right: auto 
	}
	
h2 {text-align:center}
h4 {text-align:center}
p {text-align:center}

#header { 
height: 220px;
}

#content { 
position: relative;
top: -35%;
}

#content2 {
top: 35%
}

* {
margin: 0;
}
html, body {
height: 80%;
}
.wrapper {
min-height: 95%;
height: auto !important;
height: 95%;
margin: 0 auto -4em;
}
#footer, .push {
height: 3px;
text-align: center;
margin: 0px;
position: absolute;
bottom: 2%;
width: 100%;
}
#tabs {
height: -25%;
}

#bio {
width: 60%;
}

#roll {
position: relative;
top: -5%;
}

Re: footer help

Posted: Wed Nov 02, 2011 1:13 pm
by manohoo
Right now #footer and .push have the same directives.
I suggest that you separate them and try a footer div like this:

Code: Select all

#footer {
height: 3px;
text-align: center;
margin: 0px;
position: absolute;
bottom: 0px;
width: 100%;
}

Re: footer help

Posted: Wed Nov 02, 2011 1:15 pm
by ebgames56
didnt work. Do you have teamviewer

Re: footer help

Posted: Wed Nov 02, 2011 1:33 pm
by icesolid
Looks like it would work if you changed the following:

Code: Select all

#footer, .push {
     height: 3px;
    text-align: center;
    margin: 0px;
    position: absolute;
    bottom: 2%;
    width: 100%;
}
TO:

Code: Select all

#footer {
     height: 3px;
    text-align: center;
    margin: 0;
    position: absolute;
    bottom: 0;
    width: 100%;
}
You need to define the "footer" ID independently and define the "push" Class on its own. If this does not solve your problem, then you should post your other HTML code, it is possible you have some issues there.

Re: footer help

Posted: Wed Nov 02, 2011 1:39 pm
by ebgames56
Here is my html well php

if you want to edit the code on my computer we can teamview

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>The Guitar Manifesto</title>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<?php
require("getbrowser.inc.php");
?>

</head>
<body>
<div class="wrapper">
<center><div id="header"><img class="logo" src="Szerykblue_sm.png" alt=".." /> 
          <div id="dolphinnav">
                <ul>
      		    <li><a href=""class="current"><span>Home</span></a></li>
                    <li><a href="tour.php"><span>Tour</span></a></li>
                    <li><a href="album.php"><span>Album</span></a></li>
                    <li><a href="bandScott.php"><span>Band</span></a></li>
                    <li class="parentmenu">
                        <a><span>Media</span></a>
                        <ul class="submenu">
                            <li><a href="photos.php"><span>Photos</span></a></li>
                            <li><a href="videos.php"><span>Videos</span></a></li>
                        </ul>
                    </li>
                    <li><a href="contact.php"><span>Contact</span></a></li>
                </ul>
            </div>
        </div></center>
        <br />
        </div>
 <br />
 <br />
 <div id="content" align="center"><h1>Lastest Information</h1> <br />
Here will be the lastest information to keep you up to date
<br />
<img src="scott.jpg" width="304" height="228"> <br />
I want to try to see how much text and images we can fit in on this page 
jsadfkjlsdjlfksdja <br />
<p>asdf</p>
<p>asdf</p>
<p>asdf</p>
<p>asdf</p><p>asdf</p>
<p>asdf</p>
<p>asdf</p>
<p>asdf</p>
<p>asdf</p>
</div>
<div id="footer">
        <hr /><center>Site Designed by: Matt Brown</center>
		</div><!-- #footer -->
		</body>
</html>

Re: footer help

Posted: Wed Nov 02, 2011 1:42 pm
by icesolid
I don't see where you are including your stylesheet?

Re: footer help

Posted: Wed Nov 02, 2011 1:44 pm
by ebgames56
<link rel="stylesheet" href="styles.css" type="text/css" /> srry right under the <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

Re: footer help

Posted: Wed Nov 02, 2011 1:48 pm
by icesolid
So what exactly is the problem? You want the footer to stay stationary at the bottom of your page?

If you make the adjustments we suggested here, it works?

PS - Find a alternative for the <center> tag. That is deprecated.

Re: footer help

Posted: Wed Nov 02, 2011 1:49 pm
by ebgames56
do you have teamviewer? so you can see my issue?

Re: footer help

Posted: Wed Nov 02, 2011 1:53 pm
by icesolid
No, explain your issue. What are you trying to accomplish?

Re: footer help

Posted: Wed Nov 02, 2011 1:53 pm
by ebgames56
Dude, your code for css didnt fix my issue

Re: footer help

Posted: Wed Nov 02, 2011 1:57 pm
by icesolid
So explain exactly what you are trying to accomplish?

If you want your "Site Designed by: Matt Brown" to stay fixed at the bottom of your web page, the code I gave does exactly that. I just tested on my computer. So you must have some other issues that we are not seeing here.

If there is something else you are trying to accomplish, then please explain?

Re: footer help

Posted: Wed Nov 02, 2011 2:00 pm
by icesolid
Are you trying to disable all scrolling on your web page? So like a fixed but yet flexible width / height web page (because of course everyone has differing resolutions)?