Footer problem.

I'm not sure how to do this, but the width of the footer is the same as the page itself, and I can't get it to be independent on how long the width is as it is always the same as the top. I want the width of the footer to fit the entire width of the page regardless of monitor size. Thanks.

Site: http://fjotest.forumotion.com/

Example: http://prntscr.com/5a60mv

Footer image: https://2img.net/h/i534.photobucket.com/albums/ee346/luckyduduhead1/footer.png~original


Page width :

Code:

#wrap {
   width: 83%;
        height: 100%;
        margin: 0px auto;
   background-color: transparent;
   border: 1px solid transparent;
   padding: 5px;
}

page-footer: 

Code:

#page-footer {
  background-image: url('http://i534.photobucket.com/albums/ee346/luckyduduhead1/footer.png~original');
  background-position: center;
  height:150px;
  width: auto;
}

try using !important on the end

example

Code:

#page-footer {
��background-image: url('http://i534.photobucket.com/albums/ee346/luckyduduhead1/footer.png~original')!important;
��background-position: center!important;
��height:150px!important;
��width: auto!important;
}

If that doesn't work Please try this.

Code:

#page-footer {
    background-image: url("http://i534.photobucket.com/albums/ee346/luckyduduhead1/footer.png~original");
    background-position: center center;
    height: 150px;
    width: auto;
    margin-top: -53px;
}

_Twisted_Mods_ wrote:try using !important on the end

example

Code:

#page-footer {
��background-image: url('http://i534.photobucket.com/albums/ee346/luckyduduhead1/footer.png~original')!important;
��background-position: center!important;
��height:150px!important;
��width: auto!important;
}

Mati™ wrote:If that doesn't work Please try this.

Code:

#page-footer {
    background-image: url("http://i534.photobucket.com/albums/ee346/luckyduduhead1/footer.png~original");
    background-position: center center;
    height: 150px;
    width: auto;
    margin-top: -53px;
}

None of those css codes fixed it, when I tried it, it just moved the footer image a little bit but still was the same width of the page body, and didn't change. Even when using !important

you do realize that hiding the footer links is against TOS .. so i cant help you anymore till you put them back

You need to remove whatever you are using to hide the footer links.  You are breaking the Terms of Service.  You can only use credits to remove the footer links.  Even using credits does not remove all the footer links which have to remain.

SLGray wrote:You need to remove whatever you are using to hide the footer links.  You are breaking the Terms of Service.  You can only use credits to remove the footer links.  Even using credits does not remove all the footer links which have to remain.

I indented the links to the side of the page temporarily so I can actually see how I am going to place the bar, then after i'm done i'm going to place the links on top of the bar where I like it. But that's the reason I came here for help anyways.


My priority is placing my footer bar where I like it first, i'll put them back when i'm done placing my image. That forum drives no traffic and is only visited by bots and is used primarily for my knowledge of CSS coding.

Sorry for that.

I believe you will have to modify the footer template.

SLGray wrote:I believe you will have to modify the footer template.

Hmm, it seems when I go to Templates>General, all I see is overall_footer_begin and overall_footer_end, which both seem to only have anything to do with the footer links and not the actual size/width of the footer box. Unless i'm missing something. 

Code:

#page-body {width: 83%; margin-right: auto; margin-left: auto;}
#wrap {width: 100%;}

_Twisted_Mods_ wrote:

Code:

#page-body {width: 83%; margin-right: auto; margin-left: auto;}
#wrap {width: 100%;}

Thanks so much, this helped. Just one issue. The code seems to increase the width of the entire page just a bit to the point where a scroll bar is needed to go left and right and I couldn't fix it using my own knowledge. Other than that, thanks Twisted. 

The footerlinks also have been restored

#wrap {width: 98%;}

_Twisted_Mods_ wrote:#wrap {width: 98%;}

Thanks, 

Twisted mods solved my problem.

on ur portal some of the widgets overlay each other ..you can adjust to site in portal management

_Twisted_Mods_ wrote:on ur portal some of the widgets overlay each other ..you can adjust to site in portal management

Are you sure? On my screen everything is perfectly fine. That's odd. That's going to be an issue though if other people see it. Is it the code you gave me?