Here is the page in question:
Roll Call » My Anderson County Tennessee | County Commission Votes To Raise Property Taxes
The problem is with the SUBMIT button at the bottom of the left hand side arrow. The button is clipped off and does not show the actual “point”. I have a link to a JPEG of what I am talking about linked here. Is this a problem with the overflow hidden? And how in the world can I fix this?!
The more content you have in the right column, the further down that arrow tip will sit. You really need to keep the arrow tip with the rest of the arrow.
I was trying to have the tip of the arrow overlap the footer area which is the darker brown area near the bottom. I kept moving forward trying to find a fix and ended up adding the bottom tip portion as a background image to the footer area.
Is it possible to have the Submit button which is the arrow tip have a position of absolute in relationship to the left column and give it a z-index of 999?
I guess so, but if anyone asks me—What’s your number one web layout tip?—I’d say, Don’t let your designs rely on fixed heights, as you can rarely have them on the web. So, while it’s a nice idea to have the arrow tip overlap the footer, I’d say it’s impractical here. Unless you fix the height of the #main section and have scroll bars on the right column, which is a big price to pay for a visual effect. I suspect site visitors would rather not scroll than have the arrow effect.
The arrow overlapping the footer doesn’t make much sense in a usable way. If the right content is much longer (as it is now) then the footer is miles down the page and the top of the arrow is then also far from where it should be.
You could place the whole arrow section down at the bottom with absolute positioning and overlap the footer and then repeat an image underneath for the straight body part of the arrow so that it reaches from top to bottom. However that will mean that you will be making users scroll down to the footer to sign up which would seem like a design flaw to me as you don’t want to make them work too hard for a call to action.
Alternatively you could leave the sign up form details at the top and just push the arrow background down the page to the footer but that would mean changing the input button design and leaving it at the top.
You really need to decide first if this is what you want and how it will work with real content. Either way is possible with a bit of creative thinking.