2013-03-16 14 views
5

Ich benutze Twitter Bootstrap und dieses Plugin für das Menü http://silviomoreto.github.com/bootstrap-select/ auswählen.Twitter Bootstrap-Registerkarten und bootstrap-select Überlauf Problem

Ich habe ein Problem, wenn ich versuche, diese Auswahl auf den Inhalt innerhalb der Registerkarten anzuwenden.

http://jsfiddle.net/gbGdY/1/ Demo zur Veranschaulichung des Problems.

Außerhalb Tabs, alles funktioniert gut, aber innerhalb Tab - Überlauf funktioniert nicht richtig.

Auch, wenn ich versuche, Tabs Überlauf außer Kraft zu setzen (wie diese)

.tab-content { 
    overflow: visible !important; 
} 

dann immer ich ein anderes Problem - Menü nach unten fällt und erweitert auf die volle Höhe.

Also, meine Frage ist, wie dieses Problem zu vermeiden, und machen Sie das Menü im Register funktioniert genau wie außerhalb Tabs arbeiten.

Antwort

3

Hoffen Sie, dass Sie immer noch nach einer Lösung suchen? wenn Sie sind, können Sie versuchen, diese ein:

Überlauf add: versteckt Tabula Inhalt

<div class="tab-content" style="overflow: hidden"> 

und Daten-Container als Tabulafenster/Tab-Inhalt

<div class="btn-group bootstrap-select" data-container="tab-pane"> 

hinzufügen und hinzufügen/ändern Sie die CSS-Regeln nach Bedarf

.dropdown-menu { 
    height:200px; 
} 

.tab-content{ 
    height: 350px; 
    background: green; 
    padding: 2%; 
} 

und es wird sich herausstellen, einige zu sein sache wie folgt: http://jsfiddle.net/gbGdY/1/

hoffe das hilft! -r

2

Setzen Sie die .tab-content auf overflow: visible wie Sie getan haben.

Dann setzen:

.dropdown-menu { height:200px; } 

Oder legen Sie es auf, was auch immer gewünschte Höhe.