CODEWITHSUNDEEP
jqueryjquery-uialignmentjquery-ui-tabs
Scharrels
Scharrels

Reputation: 3055

Align one tab to the right in JQuery UI

I have a set of tabs, representing different sections of a form, all aligned to the left. When a user has filled in all sections, I want him to be able to review the entire form.

I'm using jQuery UI Tabs to split the sections in different parts. The user can switch between the sections as often as he wants.

I now want the following:

So the question is: how can I change the style of an individual tab in jQuery UI?

Upvotes: 9

Views: 7525

Answers (2)

MikeM
MikeM

Reputation: 27405

you should be able to set an id or class attribute on the tab you want right aligned, you can then set the css for that id or class, you may need to use !important after your custom styling so that the jqueryui stylesheet will be overridden with your settings

http://jsfiddle.net/4Xmkf/1/

here's a jsfiddle showing a simple example

Upvotes: 18

Xavier Holt
Xavier Holt

Reputation: 14619

I think you could do this with CSS. If you build your tabs from a <ul>, then just add a class to the last <li> (the overview one), and use CSS to float it to the right.

You should be able to use that class to do whatever other styling you want, too.

Hope this helps!

Upvotes: 0

Related Questions