Tutaj mam problem. Włączam Firefoxa i szok. Tłumaczyć chyba nie muszę, sami zobaczycie:
Chrome, IE, Opera - wszystko jak należy. W FF Slideshow jest na cholernie na prawo >>> i się suwak do przewijania strony pojawił.
SS:
IE (jest dobrze)
Chrome (też dobrze)
Firefox (co to do cholery jest!?)
Nie zwracajcie uwagi na logo, na początku były inne założenia ..


CSS Slideshow:
.ui-slideshow { height: 300px; width: 640px; overflow: hidden; position: relative; border: 1px solid #750042; top: 15px; background-color: #000000; align: center;} .ui-slideshow .slideshow { height: 300px; width: 640px; position: relative; z-index: 10; } .ui-slideshow .mask { height: 300px; width: 640px; position: absolute; top: 0; left: 0; z-index: 30; cursor: pointer; background-image: url(images/slideshow-mask.png) no-repeat 50% 0; } .ui-slideshow .caption { position: absolute; left: 30px; bottom: 30px; width: 580px; z-index: 35; text-shadow: 0 0 15px #000, 0 0 15px #000, 0 0 5px #000, 0 0 19px #000, 0 0 19px #000;} .ui-slideshow .caption h3 { font-size: 28px; color: red; } .ui-slideshow .paging { position: absolute; top: 15px; right: 15px; width: 15px; z-index: 35; } .ui-slideshow .paging a { display: block; height: 10px; margin-bottom: 5px; background-color: #e50382; opacity: .5; border-radius: 3px } .ui-slideshow .paging a:hover, .ui-slideshow .preview { color: #000; text-align: center; width: 100px; padding: 5px; background: #e57bb7; position: absolute; display: none; right: 35px; top: 15px; border-radius: 5px; z-index: 35; } .ui-slideshow .preview span { display: block; } .ui-slideshow .slide { height: 300px; width: 640px; position: absolute; top: 0; left: 0; background-position: 0 0; background-repeat: no-repeat; z-index: 15; } .ui-slideshow .slide .click-area { width: 100%; height: 300px; position: absolute; bottom: 0; left: 0; z-index: 20; } .ui-slideshow .slide .click-area embed { z-index: 25; } .ui-slideshow .preview { color: #000; text-align: center; width: 100px; padding: 5px; background: #e57bb7; position: absolute; display: none; right: 35px; top: 15px; border-radius: 5px; z-index: 35; } /* content */ .ui-slideshow .mask { background: url("images/slideshow-mask.png") 0 0 no-repeat; }
Główny CSS:
html {background-image: url(images/background.jpg);} body { position: relative; border: 1px solid #111111; padding: 10px; width: 72%; margin: auto; background-color: #000000; box-shadow: 0 0 35px rgba(0, 0, 0, .5)} p1 {color: #fff; padding-left: 20px;} #logowrapper { position : relative; margin : 0px; background : url(images/logo.png) no-repeat 5px 0px; z-index: 5; } p1 { color: #fff; } div#menu { float: left; height: 45px; width: 100%; background-image: url(images/menu.png); border-top-right-radius: 5px; border-top-left-radius: 5px; font-family: Walkway Rounded; background-repeat: repeat-x; } div#menu a { display: inline-block; text-decoration: none; color: #fff; padding: 5px; margin-right: 10px; } div#menu a:hover { color: #FF0000; } .srodek { width: 100%; height: auto; background-image: url(images/body.png); background-repeat: repeat-x; background-color: #750042; color: #fff; }