Footer problem for responsive wordpress site

[pellemodcom]

Hi guys!

I’m not a professional developer, but I’m helping out a friend of min to get his portfolio site upp. Check it out: http://www.mansclausen.se/dev

The startpage has a big background photo of him. and the page has no other content. Other pages does not use a background image.

I tried solving it like this:

<div id="spejsare"> 
</div><!-- #spejsare -->

#spejsare {
    padding: 500px.0.300px.0
}

But Explorer does not like it. And I’d probably need different versions for smaller screens.

Any ideas?

[pellemodcom]

At first I thought about doing the sticky footer technique in the snippet section here, but it demands a static footer height, right? And that might change, if the owner start messing with the widgets, so that will not work… :-/

[pellemodcom]

oups, mistake by me… But that didn’t solve the problem unfortunately. To me it looks quite allright with 500px padding in a div. Made the div red, just to see it.

But Internet Explorer will not take that of course. Any ideas?

[Senff]

500 px top padding? That can’t be right.

I tried solving it like this:

But you’re not stating what the actual problem is. When I look at the link you included, it doesn’t have that 500 px padding either, so it’s unclear what you’re trying to do really.

[taxicss]

If I got it right, the page only consist of the header, the image, and the footer, right? And you want that image to be visible so you added a div with padding just to push down the footer?

OK, first why do you need to use JavaScript to add that image? Why not just add it directly in your HTML so that it will have its own box in the document flow making your footer stay below it and not on top of your background/image.

[Tom Houy]

Sticky footers can have a flexible height, just don’t set a height on the element at all or use a min-height. If you’ve got a sticky footer block set to Position: Fixed and Bottom: 0px, as you add and content to the block, it will expand upwards.

I don’t quite understand what your question(s) is/are though.

[pellemodcom]

Thanks for all the response guys! Sorry for bad explaining. English is my second language, and I clearly don’t speak HTML or CSS.

@Senff, sorry I must have removed it when I was trying different things to work around the problem.

@Taxicss, Yes you understood me right! The reason to have it in the background is that the user wants to have a series of images on the startpage. So i downloaded a plugin that gets a different image on page reload. (called Background manager)

@Tom Houy, ok cool. I’ll try that.

[Author]

Posts