using blueprint css within a jquery ui tab

Question

I'm using blueprint to do a complex form layout that involves jquery-ui tabs, but when I try to use the blueprint span-x divs within the jquery-ui tabs, the formatting gets all screwy....

<div id="tabs">
  <ul>
    <li><a href="#blahblah"><span>blah blah</span></a></li>
    <li><a href="#blahblahblah"><span>blah blah blah</span></a></li>
  </ul>
  <div id="blahblah">
    <div "class="span-8 last">
      <dl>
       <!--some input boxes-->
      </dl>
    </div>
  </div>
</div>

If i take the "class-span-8 last" out, the page works as expected. Any help / ideas would be much appreciated!

score 9 · Accepted Answer · answered Jun 04 '09 at 15:14

9

You might want to try giving each tab/div the blueprint "container" class.

answered Jun 04 '09 at 15:14

Rob

3,026
4
30
32

But wouldn't that cause overflow? – Georgie Porgie Jul 07 '11 at 22:09

score 0 · Answer 2 · answered Jun 04 '09 at 15:09

0

I am guessing that it's probably because the div overflows. Start with span-1 and work your way up.

answered Jun 04 '09 at 15:09

aleemb

31,265
19
98
114

using blueprint css within a jquery ui tab

2 Answers2