• Resolved practical

    (@kit-grill)


    Hi,

    I’ve been looking for a while to find a fix but have given up!

    The footer seems to be stuck in the container, and being no whizz kid in wordpress I can’t find and think how to get around this. Ideally I would like the footer relative to the content.

    I’ve tried changing relative, absolute, fixed etc but all chnages to the footer happen when i change container settings.

    website – http://www.primarycoloursrecords.co.uk

    any help much appreciated 🙂

Viewing 5 replies - 1 through 5 (of 5 total)
  • Hello,
    you might try deactivating the footer-putter plugin,

    first line in your css body, h1, h2, h3, h4, h5,
    remove the last comma.

    your theme css file has:

    #footer {
    	width:900px;
        	margin: 0 auto;
    	position: fixed;
       	padding-bottom: 8px;
        	padding-left: 20px;
        	width: 100%;
    
    }

    header is set to height: 100%;, this can’t be what you want.

    remove the position:fixed, remove the duplicate width.

    Move the #footer declaration up in your css file above the @media stuff.

    missing semi-colon here after font family:

    h1, h2 {
    	text-transform:none;
    	margin: 0px 0px 0px 0px;
    	font-family: Arial Black, Gadget, sans-serif
    	font-weight: normal;

    view and fix the css errors as seen here.

    HTH

    Thread Starter practical

    (@kit-grill)

    Hi

    Thanks for your help, didn’t realise there was a css validator too 🙂

    I’ve made the changes but the footer is still lingering near the header, do you know why this may be?

    thanks again

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Probably because your container has a position of absolute.

    Thread Starter practical

    (@kit-grill)

    I’ve figured it now, changed the footer to below and all worked.

    #footer {
    position:absolute;
    padding-left: 20px;
    bottom:0px;
    width:945px;
    height:25px;
    padding:0px;
    margin:10px;
    clear: both;

    }

    No not really, Andrew is correct,
    your container has a position of absolute,
    – remove that, and change margin: 0 auto; to margin: 0;
    no your footer has a position of absolute,
    your css will give you issues in the future.

    You have not followed the above suggestions:
    header is set to height: 100%;, this can’t be what you want.

    remove the position:fixed, remove the duplicate width.

    Move the #footer declaration up in your css file above the @media stuff.

    missing semi-colon here after font family:

    All of which are required to solve your issue.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Footer stuck in container’ is closed to new replies.