Hi Nick - I think the display:block property is needed for the icon div to maintain dimension or it will collapse but it's probably wrapping because you need to float this left or right so it will sit on the same line as the text. The UI team is working on building a rich set of buttons (with icons) for future releases, but in the meantime, check out this tutorial that walks through how to use the CSS framework to build all kinds of custom buttons: http://www.filamentgroup.com/lab/styling_buttons_and_toolbars_with_the_jquery_ui_css_framework/
Cheers, Todd On Mar 30, 4:14 am, Nick <[email protected]> wrote: > I'm trying to use icons on buttons (anchors) with text, but every time > i do they end up about 70 pixels to the left (way off the button) as > well as the button being 2 lines for some reason. I've used firebug to > isolate out the offending CSS property. If i remove the > "display:block" property from ".ui-icon" the two lines goes away, but > the icon goes away (duh, so that's a no go) I've tried some forced > fixes that "work" but of course applying the globally will not be an > option. > > I can not find ANY documentation that tells you how to properly apply > an icon (or any styling) to an anchor or button, and i cant find any > relevant discussion on here. yet, obviously it works. So how did you > all do it? can someone please provide a basic tutorial on skinning > anchor links and buttons? (including background, rounded corners, and > icons (the whole #!) ) > > on request, I can provide screen caps of my issue to better illustrate > my issues. > i am on firefox 3 and testing in safari 3 and 4b. > i have not applied any style based jQuery (just click event handlers) > so if i have to do something on the JS side to style...i haven't done > that. --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "jQuery UI" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [email protected] For more options, visit this group at http://groups.google.com/group/jquery-ui?hl=en -~----------~----~----~----~------~----~------~--~---
