Re: CSS - Header formatting issues
You can use the Firefox browser and Firebug add-on to identify the CSS rules for any item on the page. There are also CSS inspection tools for IE and Opera. The screenshots appear to show IE behavior; is that the browser you're using?
Coelese.css has size properties for the login/search form. I don't recall offhand the exact CSS selector name. You can try reducing the width. The present width was set to accommodate everything that needs to fit in there (as a theme for distribution, it has to have lowest common denominator qualities to suit the widest range of site admin options).
Also be aware that IE chokes on a lot of standard CSS, so needs special treatment. There are IE browser-specific files in the /css directory, and also many themes, including Coelesce, have IE CSS files, located in their styles directory (styles/coelesce/ie7.css for example). Before making changes, it's a good idea to be sure that changing how it appears in one browser won't create a problem in another. In some cases, we didn't try to achieve exactly the same look in IE6 or IE7 that modern browsers can manage, given the CSS gymnastics that'd be required for that.
The menu item widths are given default values in css/cssmenus.css. But some themes override these because they have a different font size or whatever, so check for the rules in the stylesheet targeting something like #tiki-top .cssmenu_horiz li. Again, using Firebug or some other inspector will let you know what CSS is applied to these items.
Yes, more documentation on the CSS would be great. I think http://themes.tikiwiki.org would be the place for it. I've done a little there, but haven't had the time to do more, yet.
-- Gary