I first made my design for my website but now I want to put in some content , above my footer, my footer is becoming bigger.
How do I fix this?
I think it is because your footer position is fixed with a fixed height. Also, next time post your code here. (or a JsFiddle) Not a link.
Net begonnen met html zie ik.
Related
I'm learning HTML & CSS, and I'm having an issue.
My page is already built : a header, some blocks, a footer. Very simple, I'm a beginner.
I'd like the footer to stay fixed on the bottom until it reaches a limit situated 50px under the last block (if we scale the viewport). Then it should just stay there like a normal block... But I can't figure out how to make it happen!
Could you help me, please?
By the way, I speak French : if something isn't clear enough, please tell me and I'll try to explain.
Thank you in advance for your help,
Adrien.
There are many different ways to handle this with purely CSS.
Firstly Twitter Bootstrap has a nice means of doing this. Link is here
Or you could use the CSS Sticky Footer See here
The key is to create a negative bottom margin in the main container, using the exact height you want your footer to be.
I hope this helps.
The easiest way is to observe this live
Homepage footer (looks good): www.fishingreports.com
Screwed up footer: www.fishingreports.com/users/register
Whenever I export the code from /users/register onto another page like this: www.fishingreports.com/texas/lake-texoma
you can see the footer also goes haywire. I'm sure I'm missing something here that keeps the rest of the page in line.
Something interesting to note is that when there is OTHER STUFF on the page the footer acts fine, but when the form is the semi-last thing on the page the footer screws up. Compare these two pages:
http://www.fishingreports.com/washington/lake-saint-clair (good)
http://www.fishingreports.com/washington/lake-leota (bad footer!)
Thanks!
On the pages where the footer is messed up the footer is a part of the container div, causing the padding to apply and the size of the footer to be reduced.
You most probably have an unclosed div issue, this tool can help you with that: http://validator.w3.org/check?uri=http%3A%2F%2Fwww.fishingreports.com%2Fusers%2Fregister&charset=%28detect+automatically%29&doctype=Inline&group=0
Good luck.
So I have a site that scales down gracefully in the browser window but I am having an issue with the content outside of my header. The main and footer elements are just hovering in the middle of all my content. I believe it may be something to do with the height I set to the header but I need to space out all the elements within that correctly.
Heres a link to the site: http://nathanlangley.co.uk/sitev5/index.html
Any help will be greatly appreciated.
"I believe it may be something to do with the height I set to the header"
I just followed your link, and, following your suggestion, tried taking the height attribute off the header. It fixes it.
First, I'd like to say that I have no experience with HTML or CSS so bear with me here.
I'm trying to have a Logo, content, then footer. The Logo has a background that overlaps with content, and footer has a background that overlaps with footer aswell.
This pic might explain better: http://picpaste.com/help-vXUqWlZ8.png
HTML Code: http://pastebin.com/0ZWCB9jU
CSS Code: /w7Ugu78Z <-- also pastebin, but I can't post entire link due to spam prevention.
The problem is that, there's an extra space at the bottom of the page that I can't remove.
Would really appreciate any help.. I tried googling but the solutions I found I failed to get it to work.
Best Regards,
Essam.
It seems you want the footer to remain at the bottom of the page.
I think this is what you're looking for: http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page
There's this bug that I can't seem to fix where IE cuts off part of my text if I leave the footer in the same exact place as the main page. The following are examples of my main page footer position and the subpage footer position. I was wondering is it bad design to move the footer position this way? (the flow of the site fits better with the moving of the footer though)
Main page: http://www.sixfoldstudios.com/stars/index.html
Subpages: http://www.sixfoldstudios.com/stars/home.html
Thanks!
The footer doesn't look all that different except that it is smaller on the subpages. This is not a bad design decision.
As long as the footer looks the same overall and doesn't throws the text around it should be okay. People don't really look at the footer unless they need something from it so I'm sure most visitors won't even notice.
I am not a designer, so I can't answer you from this scope. But as user, I can't say that looks bad, your footer doesn't include any great information for the end user, that will visit just the website, I doubt if most users even check it. Of course the things change if you had a sitemap. Also big sites use different position for footers, here an example of ebay.
Homepage: http://www.ebay.com/
Answers Center: http://pages.ebay.com/community/answercenter/index.html
I would keep the footer the same everywhere. The reason why you might have a problem is because your footer div is in the rightcontent div.
Just move it outside just before the closing div of your container and if text overlaps it set the css to clear:both;
I have two sets of class for both me mainpage & subpages footer at times & it doesn't bother me much as long it does it work ^_^