2016-03-25 24 views
0
html lang="{jrCore_lang module="_settings" id="lang" default="en"}" dir="{jrCore_lang module="_settings" id="direction" default="ltr"}" class="app js no-touch no-android chrome no-firefox no-iemobile no-ie no-ie8 no-ie10 no-ie11 no-ios no-ios7 ipad" 

Ne var ki html etiketinde var olan "app" adlı firefox için kullanılmasını istemiyorum (çünkü orada çalışmıyor) ama ben diğer tarayıcılarda kullanmak istiyorum. Etrafında ne olacak?Firefox için kullanılmaması gereken kod

kodu şöyle bir şeydir:

.app, 
    .app body { 
    height: 100%; 
    overflow: hidden; 
    } 
    .app .hbox.stretch { 
    height: 100%; 
    } 
    .app .vbox > section, 
    .app .vbox > footer { 
    position: absolute; 
    } 
    .app .vbox.flex > section > section { 
    overflow: auto; 

Ve asıl sorun buradan geliyor gibi görünüyor: sayfanın en üstünde olmalıdır ana mutlak unsurları olduğunu Kullanılması

.vbox { 
    display: table; 
    border-spacing: 0; 
    position: relative; 
    height: 100%; 
    width: 100%; 
    } 
    .vbox > section, 
    .vbox > footer { 
    top: 0; 
    bottom: 0; 
    width: 100%; 
    } 
    .vbox > header ~ section { 
    top: 50px; 
    } 
    .vbox > header.header-md ~ section { 
    top: 60px; 
    } 
    .vbox > section.w-f { 
    bottom: 50px; 
    } 
    .vbox > section.w-f-md { 
    bottom: 60px; 
    } 
    .vbox > footer { 
    top: auto; 
    z-index: 1000; 
    } 
    .vbox.flex > header, 
    .vbox.flex > section, 
    .vbox.flex > footer { 
    position: inherit; 
    } 
    .vbox.flex > section { 
    display: table-row; 
    height: 100%; 
    } 
    .vbox.flex > section > section { 
    position: relative; 
    height: 100%; 
    -webkit-overflow-scrolling: touch; 
    } 
    .ie .vbox.flex > section > section { 
    display: table-cell; 
    } 
    .vbox.flex > section > section > section { 
    position: absolute; 
    top: 0; 
    bottom: 0; 
    left: 0; 
    right: 0; 
    } 

üstüne git ve sayfada hiçbir şey gösterilmez.

sayfa: Herhangi bir yardım için http://dev.wowmusic.fm/

teşekkürler.

.vbox { 
    display: table; 
    border-spacing: 0; 
    position: relative; 
    height: 100%; 
    width: 100%; 
} 
altbilgi elemanlarının mutlak konumlama çalışalım görünüyor

tabloyu (ama ben o ekranı ihtiyacım bahis: tablo başka bir şey için) i ekran götürmek durumunda

[Güncelleme] .

cevap

0

html seviyesinde tarayıcı sınıfları doğru ayarlandığını varsayarsak, ben sadece bunu yapmak mümkün olacağını düşünüyorum:

.no-firefox .app, 
    .no-firefox .app body { 
    height: 100%; 
    overflow: hidden; 
    } 
    .no-firefox .app .hbox.stretch { 
    height: 100%; 
    } 
    .no-firefox .app .vbox > section, 
    .no-firefox .app .vbox > footer { 
    position: absolute; 
    } 
    .no-firefox .app .vbox.flex > section > section { 
    overflow: auto; 
    } 

Bir tür neden temel stil içine bakmak öneririm diğer tarayıcılar için çalışıyor, ancak Firefox değil, ama sizin seçiminiz.

+0

Bahşiş için teşekkürler! Onu aramaya başlayacağım – Nmaster88