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 3 of 3
  1. #1
    New Coder
    Join Date
    Nov 2005
    Posts
    52
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Footer for copyright info

    Ok to start of here is the page im working on http://trentamd.soc.staffs.ac.uk/stu...424/about.html it's for a university personal webpage and im new to CSS but ive been hitting a brick wall since i decided to add a footer and copyright information (it needs to be there nad i need ot know what im doing wrong lol)

    anyway you can view the html source easily and here is the css file code:
    Code:
    body,td,th {
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	background-image: url(images/background.gif);
    	background-position: 50%;
    }
    #banner {
    	position:absolute;
    	left:0px;
    	top:0px;
    	width:550px;
    	height:120px;
    	z-index:auto;
    	background-image: url(images/banner.jpg);
    }
    #navigation a:link {
    	color: #FFFFFF;
    	text-decoration: none;
    }
    #navigation a:visited {
    	color: #FFFFFF;
    	text-decoration: none;
    }
    #navigation a:active {
    	color: #FFFFFF;
    	text-decoration: none;
    }
    #navigation a:hover {
    	color: #FFFFFF;
    	text-decoration: underline;
    }
    #navigation {
    	position:absolute;
    	left:0px;
    	top:120px;
    	width:530px;
    	height:20px;
    	z-index:auto;
    	background-image: url(images/navbar.jpg);
    	padding-top: 3px;
    	padding-left: 20px;
    	color: #FFFFFF;
    }
    #h2 {
    	position:absolute;
    	left:0px;
    	top:142px;
    	width:550px;
    	height:37px;
    	z-index:auto;
    	overflow: visible;
    	border-bottom-style: dashed;
    	border-bottom-width: 1px;
    	border-bottom-color: #D50803;
    	color: #CD3504;
    	background-color: #FFFFFF;
    }
    #content {
    	position:absolute;
    	left:0px;
    	top:179px;
    	width:550px;
    	height:112px;
    	z-index:1;
    }
    #content a:link {
    	color: #000000;
    	text-decoration: underline;
    }
    #whole {
    	margin: auto;
    	width: 550px;
    	position: relative;
    }
    .sub {
    	color: #CD1803;
    	border-bottom-style: groove;
    	border-bottom-color: #CD1803;
    	border-bottom-width: thin;
    }
    #copyright {
    	position:absolute;
    	left:-1px;
    	top:577px;
    	width:549px;
    	height:19px;
    	z-index:auto;
    	visibility: visible;
    	text-align: center;
    	border-top-color: #FF0000;
    	border-top-style: solid;
    	border-top-width: thin;
    }
    #copyright a:link {
    	color: #000000;
    	text-decoration: underline;
    now if youve been to my website you'll see that on three of the pages (Home, Links and Work) i have the footer at the bottom of the page in the right place but if my content goes over the amount of pixels set for it the footer/copyright stays in the content box and dosn't move down which i want it to do lol

    now if you look at the about page you'll see all is good you get to the footer then it's about what 50px's awa from the content! anyone got any ideas on how to fix this? Ive had a look around but with no luck

  • #2
    Senior Coder
    Join Date
    Dec 2004
    Location
    Essex, UK
    Posts
    2,636
    Thanks
    0
    Thanked 0 Times in 0 Posts
    You shouldn't be using absolute positioning for it.

    In fact you shouldn't be using absolute positioning at all. There is no need to for that layout.

    I'd say redo the layout using relative positioning and you'll see it'll flow together better.

  • #3
    New Coder
    Join Date
    Nov 2005
    Posts
    52
    Thanks
    0
    Thanked 0 Times in 0 Posts
    ok thanks i'll change the positioning to relative

    EDIT problem sorted thanks
    Last edited by jackle; 11-30-2005 at 12:30 AM.


  •  

    Posting Permissions

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