2011-07-23 7 views
4

jQueryUiのタブに問題があります。私は、タブビューの左側にナビゲーションバーを持っていますが、レイアウトは機能していません。私はそれがバグだと思って、それをjQueryに報告しますが、まずこれをバグであると確認できるかどうかを確認したいのですか、何か間違っていますか?jQuery-UI css floatに問題のあるタブ

[http://public.virtualmischa.de/bugs/jqueryui-tabslayout.html]で私の例をプレビューしてください。

最初に、動作していないタブの例と、作業標準のfloating divの例が表示されます。

<!DOCTYPE html> 
<html> 
<head> 
    <title>JQuery Tablayout problems</title> 
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.min.js"></script> 
    <script type="text/javascript"> 
    $(document).ready(function() { 
    $("#tabs").tabs(); 
    }); 
    </script> 
</head> 
<body> 
<div style="float:left; width:200; color: red;height: 200px;">Where is my left bar?<br></div> 
<div id="tabs"><ul><li><a href="#a1">A tab page</a></li></ul> 
    <div id="a1">Do you see a red bar left of this tab view?</a></div> 
</div> 

<div style="float:clear"></div> 

<div style="float:left; width:200; color: red;height: 200px;">Where is my left bar?<br></div> 
<div id="no-tabs"><ul><li><a href="#a2">A tab page</a></li></ul> 
    <div id="a2">Do you see a red bar left of this tab view?</a></div> 
</div> 
</body> 
</html> 

答えて

5

解決策は私の問題を解決しました。あなたのように見えます。詳細については jquery ui tip floated divs insideをご覧ください。

#yourTabsDiv { 
    float:left; 

    width: 100%; 

} 
+0

ありがとうございます。これは私に多くの仕事を節約しました:D – Mathlight

+0

これは答えとしてマークする必要があります –

関連する問題