Problem z wyświetlaniem strony w przeglądarce Chrome


(Adudajek) #1

Witam,

borykam się z problemem wyświetlania strony w przeglądarce Chrome.

Problem polega na tym, że na przeglądarkach typu Opera, Firefox, itd wyświetla się w poziomie lista zdjęć i ruszając myszką w lewo lub w prawo zawartość okna przesuwa się za kursorem. Jednak w przeglądarce Chrome zawartość tego samego okna pokazuje tylko jedno zdjęcie i ani mysli poruszyć się w jakąkolwiek stronę.

Znajomy zaproponował dodanie fragmentu do css:

table.box0 {


 display: inline;

 float: left;


}

jednak dodanie owego fragmentu gdziekolwiek, nie rozwiązała problemu. a dodając go zaraz po “table box 0” zaczyna wyświetlać więcej obrazków w oknie w Chromie, ale znika opcja przewijania zdjęc wraz z ruchem kursora i w Operze i w Chromie. załączam kod css strony:

CENTER,BODY,html { height: 100%; } /* all, bez tego elementy nie centrują… się przy DTD HTML 4.01 Transitional */

body {background:white;margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}

#tlot {height:545px;width:934px;/* wys strony1 */}

#tlo { /*background: url('') no-repeat white; wys strony2 */

height:509px;width:934px;position:relative;font:14px Verdana; /* obszar centralny szary. który jest w id="tlot" */}


#flagi {position:absolute;top:85px;right:20px;width:55px;height:11px; /* blon na flagi */}

#menu {position:absolute;top:12px;right:0px;color:black; /* menu boczne */}


a.l:link,a.l:visited,a.l:active {color:black;font:16px Verdana;TEXT-ALIGN:RIGHT;text-decoration:none; /* dla linków które mają class="l" */}

a.l:hover {color:black;font:16px Verdana;TEXT-ALIGN:RIGHT;text-decoration:underline;}


#map {width:483px;height:314px;position:absolute;top:0px;right:0px;}

#mapi {width:483px;height:314px;margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}


/* box 1,2,3 */


table.box0 {display:inline;}

table.box0 td {width:160px;height:314px;border:0px solid red;}

div.box1 {vertical-align:bottom;text-align:left;color:#E1E1E1;}

div.box2 {width:160px;height:194px;border:0px solid blue;position:relative;text-align:center;}

div.box3 {vertical-align:top;text-align:left;color:#E1E1E1;}

div.box1x {vertical-align:bottom;text-align:left;color:#000;}

div.box3x {vertical-align:top;text-align:left;color:#000;}

div.box1,div.box3,div.box1x,div.box3x {font:10px Verdana;width:160px;height:55px;border:0px solid green;position:relative;}


/*dynam links*/

td.al,td.ar {vertical-align:top; width:200px; height:25px;font:10px Verdana;}

td.ar {width:400px;}


#obraz {position:absolute;top:0px;right:0px;z-index: 2;}

#obraz2 {position:absolute;top:0px;left:10px;z-index: 2;}

#logo {position:absolute;top:6px;left:0px;width:90px;height:185px; /* box np na logo */}

#text_up {position:absolute;top:100px;left:0px}

#text {position:absolute;top:0px;width:934px;left:0px;height:314px;background:#E1E1E1; overflow: auto;overflow-x:hidden;font:12px Verdana;text-align:left;z-index: 1; /* niebieski box np. dla treści strony css3 overflow hidden*/}

#tlol { /* background: url('') white repeat-x; */

height: 533px;width:auto}

#tlop { /* background: url('') white repeat-x; */

height: 533px;width:auto}

#stopka {position:absolute;bottom:60px;left:0px;font:10px Verdana} /*dol strony*/

#ql {position:absolute; bottom:60px;right:0px;} /*male logo qltech na dole po prawej*/

#podmenu {font:12px Verdana;position:absolute;top:20px;right:0px;text-transform:lowercase;}

#t {position:absolute;top:5px;left:5px;width:400px;z-index: 3;font:10px Verdana} /*teksty po lewej stronie*/

#osoba {position:absolute;top:10px;left:200px;width:400px;z-index:3;} /*teksty opisujace pracownikow */

#naglowek {position:absolute;top:5px;left:5px;} /*naglowek w typach*/ 


#kol1 {position:absolute;top:25px;left:5px;width:300px;line-height:20px;z-index: 3;} /*kolumna pierwsza w chronologicznie*/

#kol2 {position:absolute;top:25px;left:300px;width:300px;line-height:20px;z-index: 3;} /*kolumna druga*/

#kol3 {position:absolute;top:25px;left:600px;width:300px;line-height:20px;z-index: 3;} /*kolumna druga*/


/* dla wszystkich linkow */

a:link,a:visited,a:active {font:10px Verdana;color:black;text-decoration:none; }

a:hover {font:10px Verdana;color:black;text-decoration:underline;}


/*e-mail*/

a.m:link,a.m:visited,a.m:active{font:12px Verdana;color:#F9933F;text-decoration:none;}

a.m:hover {font:12px Verdana;color:#F9933F;text-decoration:none;}


/*menu gorne glowne*/

a.n:link,a.n:visited,a.n:active{font:10px Verdana;color:#555555;text-decoration:none;padding-right:16px;padding-left:15px;}


a.n:hover {font:10px Verdana;color:#F9933F;text-decoration:none;padding-right:16px;padding-left:15px;}


/*podmenu*/

a.s:link,a.s:visited{font:10px Verdana;font-weight:bold;color:#555555;text-decoration:none;}

a.s:active{font:10px Verdana;font-weight:bold;color:#F9933F;text-decoration:none;}

a.s:hover {font:10px Verdana;font-weight:bold;color:black;text-decoration:none;}


#kon {text-align:right;padding-right:60px; /* do kontaktu adres firmy */}

#posName,#posEmail,#posText {background:url('') transparent; /* dotyczy tła formularzy */}


img {border:0px; }

h1,h2,h3,h4 {font:10px Verdana;color:black;text-decoration:none;}

#tabcc {width:100%;height:100%;border:0px;margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}

#tabc {width:100%;height:533px;}


/*iframe z js */

.ifram {width:934px;height:314px;border:0px;padding:0px 0px 0px 0px;margin:0px 0px 0px 0px;}


/* table miniaturki */


.fotom {border:1px solid #E1E1E1;padding:0px 0px 0px 0px;margin:0px 0px 0px 0px;position:absolute;left:0px;bottom:0px;}

TD.fotom2 {border:1px solid #E1E1E1;border-left:0px solid #E1E1E1;}

.opacon {filter:alpha(opacity=60);opacity: 0.6;-moz-opacity:0.6;}

.opacoff {filter:alpha(opacity=100);opacity: 1.0;-moz-opacity:1.0;}

#slide-images{

	position:relative;

	display:block;

	margin:0px;

	padding:0px;

	width:934px;

	height:314px;

	overflow:hidden;

}


#slide-images li{

	position:absolute;

	display:block;

	list-style-type:none;

	top:0px;left:0px;


	margin:0px;

	padding:0px;

	background-color:#FFFFFF;

}


#slide-images li img{

	display:block;

	background-color:#FFFFFF;

}


.highlightit img{

filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);

-moz-opacity: 0.5;

opacity: 0.6;

}


.highlightit:hover img{

filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);

-moz-opacity: 1;

opacity: 1;

}

bardzo proszę o pomoc – Dodane 11.09.2012 (Wt) 9:01 – udało się rozwiązać problem. fragment:

table.box0 {

 display : inline;

 display : inline-block;

 }

załatwił sprawę.

można zamknąć


(ra-v) #2
table.box0 {

 display : inline;

 display : inline-block;

 }

To chyba to samo co

table.box0 {

 display : inline-block;

 }