New version of ImageRedirection.class.php available.
A few days ago I stumbled upon what I thought was a css bug in Firefox, but after testing the case with Opera and still getting the same "bugged" result I started to wonder if it was the browser that was bugged or just my way of looking at it. Could it be that for once IE6 and IE7 was correctly rendering my page whilst Firefox and Opera was being bad? Also, the "bug" seemed to fix itself if I used borders on the affected divs, weird uh?
My layout consisted of basicly 3 divs. One at the top and a container div holding another div positioned 10px from the top of the container div. Just like below.
Here in the example source I only use simple divs without anything else than different background colors.
When lookin at the page in IE6 or IE7 everything looks just fine, however in Opera and Firefox you'll get this result:
It seems that the inner div adds top-margin to it's parent instead of applying it to itself, why this happens I have no idea.
One solution I found was that if I apply borders on the affected divs I get Opera and Firefox to render the page correctly. Why borders would change how margins are interpreted I have no idea. Anyway this isn't a solution to stick with since we don't want any borders, if used with background images it will ruin the design.
After playing around some more I realized that if I instead of using margin on the div I wished to position I could ofcourse use padding on it's parent for the same result. And ta-da it works in all four browsers! However since I'm a Windows user I have no idea how any of this behaves in Safari, but I will update the post after I check using some online screenshot provider.
If you have any opinions/facts about this being a bug or not and solutions feel free to post comments. You can view my test page with source and all 3 examples here
For those of you who don't know what ImgRed is I suggest you go and take a look. In short it's a way to avoid hotlinking but still include the original URL.
The idea is great I think but the solution is far from optimized. I took the liberty of rewriting the whole script. If you have further suggestions of improvements they are welcome.
This is the form of validation I like the most: Prevent the user from inputting the wrong information. In this case I have a field for a phone number, and I only want the user to be able to input numbers (0-9) and country code prefix (+).
One might argue that I should instead remove unwanted characters on the server side instead, but I rather prevent that from happening at all. It's bloody annoying with users that write stuff like "none" or "-" instead of leaving the box empty when they don't have/want to give out their phone number on a web form.
Updated to support keys like backspace and del