...

View Full Version : Two footer problems



blepblep
06-07-2012, 11:19 AM
Hi guys, first post here. I'm quite stuck and I don't really no where/how to fix it. I've been using HTML/CSS for 3 months now so it's still relatively new to me, I was wondering could anyone on here help me please.

I have a footer on my page, and when my page is loaded, the user has to scroll down to the page to see the footer, and also there is a white space under the footer too. I can solve the white space by changing the height of the footer but I don't want to do this as it is then too big. I would prefer to have it as the size I do now but without having the white space underneath it and without having the user to scroll down to see it. I would also like the footer to appear when the page is loaded no matter what screen size so the user wont have to scroll down to see it.

Here is a screenshot of my footer and how it appears -

http://i45.tinypic.com/13ynzuc.jpg

abduraooft
06-07-2012, 11:31 AM
Here is a screenshot of my footer and how it appears -
Please post your complete HTML+CSS of that page Or a link to that page.

blepblep
06-07-2012, 11:43 AM
I've solved the white space problem just now actually :)

I have a feeling the reason the footer is appearing way down the page is something got to do with the page container possibly?

Here is the CSS for my footer style -


#eFoot.eInnerWrapper {
background-color: #EEE;
background-position: top;
clear: both;
}

.eGB {
background-image: url("images/ebottomgrad.jpg");
background-repeat: repeat-x;
}

/*
input {
color:#666;
font-size:90%;
height:20px;
padding:7px 0 0 15px;
}
*/

.eWrapContainer {
margin: auto;
max-width: 1280px;
min-width: 976px;
text-align: left;
padding-left: 1.88em;
padding-right: 1.88em;
}

/* Set height of footer */
#eFoot .eWrapContainer {
background-position: top;
background-color: #EEE;
height: 200px;
clear: both;
}

#eFootLeft {
float: left;
height: 200px;
width: 15%;
}

#eFootLogoContainer {
height: 100px;
margin: 30px 0 0;
}

#eFootLogoContainer a {
display: block;
height: 50px;
width: 81px;
overflow-x: hidden;
overflow-y: hidden;
}

a {
color:#06B;
text-decoration: none;
outline: none;
}

/* Prevents purple box from appearing around image in footer in IE */
fieldset, img {
border: 0 none;
}

#eFootRightT {
height: 10px;
padding-top: 30px;
}

.eFootGroup h3 {
color: #666;
font-size: 1em;
margin: 0 0 .8em 0;
}

h3 {
color: #333;
font-weight: normal;
}

.eFootGroup ul {
margin: 0;
overflow: hidden;
padding: 0;
}

#eFoot a {
color: #2F507E;
font-size: .9em;
}

#eFootRightT, #eFootRightB {
float: left;
width: 79%;
}

body {
font-family: arial,verdana,sans-serif,clean;
font-size: 75%;
font-style: normal;
font-variant: normal;
font-weight: normal;
line-height: 1.231;
}


HTML for the above file -


<html xmlns="http://www.w3.org/1999/xhtml">

<link rel="stylesheet" type="text/css" href="footerstyle.css" />

<div id = "eFoot" class = "eInnerWrapper eGB" >
<div class = "eWrapContainer eGB">
<div id = "eFootLeft">
<p id = "eFootLogoContainer">
<a id = "eFooterLogo" href = "/webpages/TC_Tool/Tool2/tc_tool/index.php" title = "Ericsson Home">
<img src = "images/elogo.png" alt = "Ericsson">
</a>
</p>
</div>

<div id = "eFootRightT">
<div class = "eFootGroup">
<h3>Useful Links</h3>
<ul>
<li>
<a title = "CDM" href = "http://cdmweb.ericsson.se/TeamCenter/controller/home">CDM
</a>
</li>
<li>
<a title = "EriDoc" href = "https://eridoc.ericsson.se/eridoc/component/main?__dmfClientId=1338282152789&__dmfTzoff=-60">EriDoc
</a>
</li>
<li>
<a title = "Ericsson External Website" href = "http://Ericsson.com">Ericsson External Website
</a>
</li>
<li>
<a title = "Ericsson Internal Website" href = "http://internal.ericsson.com/">Ericsson Internal Website
</a>
</li>
<li>
<a title = "PDU OSS Systems Study Project" href = "http://jira.eei.ericsson.se:8081/login.jsp?permissionViolation=true&os_destination=%2Fbrowse%2FTP">PDU OSS Systems Study Project
</a>
</li>
<li>
<a title = "Contact Admin" href = "/">Contact Admin (Not Implemented)
</a>
</li>
</ul>
</div>
<div id = "eFootRightB"></div>
</div>
</div>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum