2016-07-20 8 views
1

Ich habe eine tabellarische Ansicht, deren thead ist behoben und Web-Header und Filter-Abschnitt ist auch festgelegt, so Filter Abschnitt enthält ein Bootstrap-Dropdown, dessen Z-Index ist 1000 & theads Z-Index ist 1 aber nach wie vor, dass Drop-Down dahinter wird, ist unten die Screenshot:z-index position absolut vs fixed

enter image description here

Hier sortby (position: absolute; z-index:1000) hinter diesem festen Header gehen (position: fixed; z-index:1)

Edit: Fiddle

+2

Können Sie eine jsfiddle erstellen? –

+0

oder die Website-URL (wenn es nicht Backend ist) – Ivan

+0

, die mir vor ein paar Tagen passiert ist, weiß ich nicht, ob es eine gute Idee ist, aber versuchen, Z-Index: -1 auf die feste Kopfzeile. Es sollte funktionieren. – Ivan

Antwort

1

Thead z-index:1 und drop-down z-index:9; funktioniert, versuchen und passen es ist top und margin auch Werte.

.inline-edit > thead { 
    position: fixed; 
    width: 100%; 
    z-index: 1; 
    background: #FFFFFF; 
    top: 150px; 
} 
.inline-edit thead > tr { 
    display: block; 
} 
.inline-edit thead > tr > th { 
    display: block; 
    float: left; 
} 
.inline-edit > tbody { 
    width: 100%; 
    display: block; 
    margin-top: 78px; 
} 

.top_filter { 
    padding: 15px 20px; 
    margin-bottom: 10px; 
    position: fixed; 
    width: 100%; 
    z-index: 9; 
    top: 54px; 
    background: #FFFFFF; 
} 
1

Der übergeordnete div z-index wird wirksam. Sie müssen die container-fluid eine höhere z-index wie dieses aus table-responsive

Scheck geben: https://jsfiddle.net/uwdncha0/1/