Question

I’m using the standard default functionality for jQuery tabs and I have them up and running but am having difficulties styling them.

I’ve tried overwriting where I think the styles are coming from but to no avail (I’ve removed those attempts from my code to avoid confusion – left the margin and padding to 0 for everything though). I’d like the A-Z tabs to all fit on one ‘line’ ideally (whilst still retaining the 500px width of #main).

Can anyone point me in the right direction with what I need to do, or even better provide me with the CSS that will get what I’m looking for. Thanks.

Code: http://jsfiddle.net/Deva/eTx5x/

Answer 1

Add to your css

div#tabs ul li, div#tabs ul li a {
  width: 15px;
  padding: 0;
  margin: 0;
}

http://jsfiddle.net/eTx5x/21/