Problem with my background

[Decelo]

Hi there!

Here is a website that I’ve been working on: http://codepen.io/anon/details/11415/1
I’m currently just working on the basic layout and this is one of my first attempts at making a full website so please forgive and rubbish markup, however help would be appreciated! :)
Anyways the main reason for my post is a problem I am having with the background (which is yellow), it works as intended when the browser width is greater than 960 pixels but when the width is less than that you can scroll too far right into just blank space. I can remove this by getting rid of the ‘float:left’ inside ‘footer section’ in the CSS but this ruins the layout of the footer. Is there a more elegant way of implementing my layout or a simple fix for this? I’ve tried everything to the best of my knowledge hence my post here.
Any help would be appreciated :)

Thanks,
Joe

[wolfcry911]

No offense to Chris, but I find codepen (and other testbeds) a RPITA. After copying and pasting your page locally it took me all of five seconds to find the problem:

#content p, h1{

width:560px;

}

I think you intended to do this:

#content p, #content h1{

width:560px;

}

before, all the h1 (including the ones in the footer) were 560px wide. The ‘Contact Information’ heading in the footer was pushing the html element out to the right.

[Decelo]

Thank you so much! :) The h1 width didn’t even cross my mind, I would have been there for ever.

[Author]

Posts