Welcome to WebmasterWorld Guest from 18.104.22.168
Forum Moderators: not2easy
I desperately need help with an Opera rendering issue. I am putting together a site that must render in Opera 9.5+. Usually I have no issues with Opera, as I use W3C standards compliant code with tableless CSS. However, I have one apparent bug that I cannot locate any information on and really need help with.
On my form I have three input boxes that render side by side in a small exact space. Each input box is in a left floated inline div that contains the label and box.
ie labels appear above the input  is the div
[label/ [label/ [label/
input] [input] [input] [submit]
Everything lines up correctly EXCEPT the input boxes insist on adding about 5-7 pixels to the right side of each box which makes the form area to large and the submit button ends up dropping to the next line.
I have tried margin/padding 0 on all related fields and divs, moving the float to a div above (div.classname div) everything I can think of and the space will not go away.
Does anyone know how to eliminate this space? It is not occurring in any other of the 70 browser combinations I am validating the site in. Not even IE, this is an OPERA ONLY issue.
Thank you for your help!
A few random ones:
Spaces (as in text: a space) after things happen often on inline elements.
In my experience getting pixel perfect input fields if very hard, each browser (on each platform) has it's own idea on how to render input fields. It's actually allowed to do that by the standard in order to e.g. match the default UI of the platform it is running on.
How much "for IE's sake" code is there in your CSS? It's not that because it validates that it's useful and going to cause what you intend ... Try moving all unneeded stuff to a conditional comment to lighten the load on the standard compliant browsers.