Jump to content

Fixed postion footer


Round
 Share

Recommended Posts

Hello all,

 

Sorry this may seem to be a double post but I'm pretty sure the first place I put this is incorrect! I put it in website critique and I'm after help with my layout (sorry mods remove the other post please) It's difficult to find a slot sometimes...

 

 

Anyway...

 

I have created a site aimed at mobiles.

I know it's basic but this is to ensure load times are kept low and loads in low 3g areas etc and there will be a growing amount of info added.

 

The problem I'm having is getting the footer nav bar to stay at the bottom. Works fine on apple ios and some android. Windows devices it loads at the bottom of the screen on first load but stays on that part of the page when scrolled and some androids it jumps around when scrolling.

 

It's currently handled by css

 

div#footer_wrapper {
width: 100%;
height: 150px;
position:fixed !important;
left:0;
bottom:0;
background-color:#000000;
text-align:center;
}

 

Obviously some mobiles are not compatible with positon: fixed;

I'm stuck for ideas on alternatives. Is css the right way to go about this?

 

Also the images that are web links have white borders surrounding them on windows devices I can't seem to remove.

but the following removes it on others:

 

a{
color:#FFFFFF
}

 

Any help appreciated.

 

Many thanks

 

http://www.ccevents.netne.net

 

 

 

Link to comment
Share on other sites

Hi there,

 

You wrote: "Windows devices it loads at the bottom of the screen on first load but stays on that part of the page when scrolled." Isn't that what it is supposed to do?

 

Further: "and some androids it jumps around when scrolling." That would be something it should not do. Do you use viewport declarations/settings? If so, could you try what happens without them? I would also need to know which browsers on Android. 

 

Link to comment
Share on other sites

 

You wrote: "Windows devices it loads at the bottom of the screen on first load but stays on that part of the page when scrolled." Isn't that what it is supposed to do?

 

 

No, sorry I wasn't very clear. The navbar loads at the bottom of the screen but when the user scrolls it doesn't stay at the bottom of the screen. It's becomes static to the point at where it loaded on the text etc.

 

 

Further: "and some androids it jumps around when scrolling." That would be something it should not do. Do you use viewport declarations/settings? If so, could you try what happens without them? I would also need to know which browsers on Android. 

 

I don't. I will get the browser version etc.

 

 

ive used this before with success:

 

http://www.cssstickyfooter.com/using-sticky-footer-code.html

 

 

Thanks looks interesting. I will look into it.

 

Many thanks to you both.

Link to comment
Share on other sites

This thread is more than a year old.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.