Using jQuery UI to style a div

Question

I have the jQuery UI "smoothness" theme and I would like to use the "look" to style divs on my page. E.g. apply the gray, shaded, rounded-corner effect to a regular div that ISN'T an accordion, button, etc.

I thought it would be easy! Perhaps it is?!

Thanks!

just look in the style sheet and use the same classes for your divs that are referenced in the style sheet. Shouldn't be difficult at all with a little tinkering. — Ben
– Ben, Commented Jun 2, 2011 at 11:03

andyb · Accepted Answer · 2011-06-03 13:21:39Z

6

Have a look at jQuery UI themeroller. You can select an existing theme or customize one, then using Chrome or Firefox/Firebug, for example, Right-click → Inspect element and copy the class names.

ui-widget, ui-widget-content and ui-corner-all are the most likely class names you will be looking for.

edited Jun 3, 2011 at 13:21

answered Jun 2, 2011 at 12:18

andyb

43.9k12 gold badges126 silver badges155 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

user1264732 · Accepted Answer · 2012-03-12 17:37:52Z

3

Here is what I came up with need some CSS tweaking, but should work.

<div id="login" align="center" class="ui-tabs ui-widget ui-widget-content ui-corner-all">
<ul id="login_header" class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">
    Header
</ul>
<div id="login_form" class="ui-tabs-panel ui-widget-content ui-corner-bottom">
    content
</div>

answered Mar 12, 2012 at 17:37

user1264732

312 bronze badges

Collectives™ on Stack Overflow

Using jQuery UI to style a div

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related