Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML

Why isn't entire area of button working?

If you visit a site I'm working on here:

http://thechasedesign.com/burnt-toast/?page_id=21

You will see that I've copied and pasted some code from a Tumblr theme for the form on the page.

Everything seems to work fine EXCEPT the Submit button which only the very very left side of the button seems to work. The rest of the button area doesn't work.

Is there something overlaying the element and blocking it? Thanks!

Yes, your .social-media-row div is basically covering most of your button. You can see this if you try to right click (click with two fingers on a mac) in chrome and select "inspect element." You'll see that that div is on top of your button, but's the padding of the div that is overlaying it, so it's not evident at plain site. You can hit the delete key while focused on that div in the inspector and it will remove it (don't worry, it won't actually delete from your site and if you refresh you'll see it back in it's original place) and see that the button is now focusable.

Thank you Nick!

1 Answer

Edit: I just moved this to an answer because I accidentally wrote it as a comment by mistake.

Yes, your .social-media-row div is basically covering most of your button. You can see this if you try to right click (click with two fingers on a mac) in chrome and select "inspect element." You'll see that that div is on top of your button, but's the padding of the div that is overlaying it, so it's not evident at plain site. You can hit the delete key while focused on that div in the inspector and it will remove it (don't worry, it won't actually delete from your site and if you refresh you'll see it back in it's original place) and see that the button is now focusable.