Whats up people
So i have been trying to figure out how can i make the background be the size as the content. I am using a canvas as a background.
Since i am making a j-query mobile, the content is not alot and the background goes below the footer and it looks a lot weird.
Please suggest how can i fix it. Blow is the screen shot
Thank you
Jump to PostHave you considered pushing the footer down, aka "sticky footer"? The background is going to fill the display so I think the best approach is to have the footer move to the bottom.
Have you considered pushing the footer down, aka "sticky footer"? The background is going to fill the display so I think the best approach is to have the footer move to the bottom.
Here is a link to an online example: Pushing a Footer to the Bottom of a Web Page
Do you want to put the footer at the extrem bottom ?
if yse:
change:
<body> => <body style="position:relative;">
<footer> => <footer style="position:absolute;bottom:0px;"> (maybe you are using DIV for the footer, if so do the same but footer become div)
Thanks for replying, I tried using your suggestions but it did not work with j-query mobile although it works with the normal html website. Since i code HTML pages, your suggestion will help alot. It is pretty neat.
After searching for "Sticky footer for mobile j-query", i found the solution. I lost the link but following is the code:
<style type="text/css"
[data-role=page]{height: 100% !important; position:relative !important;}
[data-role=footer]{bottom:0; position:absolute !important; top: auto !important; width:100%; height:auto;}
</style>
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.