jQuery provides a browser neutral library for accessing and manipulating the DOM. This is good.
However I’m looking for a counterpart for the visual side of things – I need to build pixel measured interfaces, without wasting so much time testing and correcting cross browser issues (buttons having crazy margins in IE, or using the wrong box model in FireFox. The many IE and otherwise instances where putting several elements on one line screws up alignment or floats).
Basically I need to be able to plan out interfaces on paper with exact pixel dimensions (for example all textboxes should be exactly 22px high), and then easily translate those designs into Html. In a WinForms world, this is usually straight forward. With html it’s anything but, and I find it’s worst when it comes to input controls.
What libraries or collections could I use to make this sort of design a reality (outside of just converting everything into Silverlight where that degree of control exists). Javascript is required to be on (AJAX to begin with), so libraries can depend on it entirely for controls.
Some of the components I’m looking for in a uniform style with precise pixel control
Buttons
Textboxes
Dropdowns
ComboBoxes (Dropdown whose text can be edited directly)
Toggle Buttons
Alternatives include dojo (pure-JS) and GWT (JS generated from Java). Some may argue that ditching JS altogether and going with the Flash-backed Flex is a good option.