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
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.