-
Visualización en Chrome
Buenas tardes, mi duda es la siguiente.
Estoy trabajando en un slider publicado en summarg: summarg.com/2011/slider-skitter-una-increible-cantidad-de-opciones
Logré su funcionamiento sin problemas. El tema es que en IE se ve perfectamente centrado, pero en Chrome se visualiza a la izquierda de la pantalla.
Por lo que estuve leyendo podría tratarse del css, pero no entiendo mucho, quería ver si podía recibir ayuda
Acá describo el archivo css
Muchas gracias por la ayuda que puedan brindarme
/* =Skitter styles
----------------------------------------------- */
.box_skitter {position:relative;width:800px;height:300px;backgr ound:#000;}
.box_skitter img { max-width:none; } /* Tip for stildv */
.box_skitter ul {display:none;}
.box_skitter .container_skitter {overflow:hidden;position:relative;}
.box_skitter .image {overflow:hidden;}
.box_skitter .image img {display:none;}
/* =Box clone
-------------------------------------------------------------- */
.box_skitter .box_clone {position:absolute;top:0;left:0;width:100px;overfl ow:hidden;display:none;z-index:20;}
.box_skitter .box_clone img {position:absolute;top:0;left:0;z-index:20;}
/* =Navigation
-------------------------------------------------------------- */
.box_skitter .prev_button {position:absolute;top:50%;left:35px;z-index:100;width:42px;height:42px;overflow:hidden;t ext-indent:-9999em;margin-top:-25px;background:url(../images/prev.png) no-repeat left top;}
.box_skitter .next_button {position:absolute;top:50%;right:35px;z-index:100;width:42px;height:42px;overflow:hidden;t ext-indent:-9999em;margin-top:-25px;background:url(../images/next.png) no-repeat left top;}
/* =Numbers
-------------------------------------------------------------- */
.box_skitter .info_slide {position:absolute;top:15px;left:15px;z-index:100;background:#000;color:#fff;font:bold 11px arial;padding:5px 0 5px 5px;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;opacity:0.75;}
.box_skitter .info_slide .image_number {background:#333;float:left;padding:2px 10px;margin:0 5px 0 0;cursor
ointer;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;}
.box_skitter .info_slide .image_number_select {background:#cc0000;float:left;padding:2px 10px;margin:0 5px 0 0;}
/* =Thumbs
Change width and height to customization dimension thumb
-------------------------------------------------------------- */
.box_skitter .container_thumbs { position:relative;overflow:hidden;height:50px; }
.box_skitter .info_slide_thumb { height:50px;-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;overflow:hidden;top:auto;top:0;left:0;pad ding:0 !important;opacity:1.0; }
.box_skitter .info_slide_thumb .image_number { overflow:hidden;width:100px;height:50px;position:r elative;margin:0 !important; padding:0 !important; -moz-border-radius:0 !important;-webkit-border-radius:0 !important;border-radius:0 !important;}
.box_skitter .info_slide_thumb .image_number img { position:absolute;top:-30px;left:-30px;height:100px;}
.box_skitter .box_scroll_thumbs { padding:0; }
.box_skitter .box_scroll_thumbs .scroll_thumbs { position:absolute;bottom:60px;left:50px;background :#ccc;background:-moz-linear-gradient(-90deg, #555, #fff);background:-webkit-gradient(linear, left top, left bottom, from(#555), to(#fff));width:200px;height:10px;overflow:hidden; text-indent:-9999em;z-index:101; cursor
ointer;border:0px solid #333; }
/* =Dots
-------------------------------------------------------------- */
.box_skitter .info_slide_dots {position:absolute;bottom:-40px;z-index:151;padding:5px 0 5px 5px;-moz-border-radius:50px;-webkit-border-radius:50px;border-radius:50px;}
.box_skitter .info_slide_dots .image_number {background:#333;float:left;margin:0 5px 0 0;cursor
ointer;-moz-border-radius:50px;-webkit-border-radius:50px;border-radius:50px;width:18px;height:18px;text-indent:-9999em;overflow:hidden;}
.box_skitter .info_slide_dots .image_number_select {background:#cc0000;float:left;margin:0 5px 0 0;}
/* =Loading
-------------------------------------------------------------- */
.loading {position:absolute; top:50%; right:50%; z-index:10000; margin:-16px -16px;color:#fff;text-indent:-9999em;overflow:hidden;background:url(../images/ajax-loader.gif) no-repeat left top;width:32px;height:32px;}
/* =Label
-------------------------------------------------------------- */
.box_skitter .label_skitter { z-index:150;position:absolute;bottom:0px;left:0px;di splay:none; }
.box_skitter .label_skitter { z-index:150;position:absolute;bottom:0px;left:0px;co lor:#fff;display:none;opacity:0.8;background:#000; }
.box_skitter .label_skitter p { padding:10px;margin:0;font:normal 22px arial,tahoma;letter-spacing:-1px; }
.box_skitter .info_slide * { font-family:Consolas,arial,tahoma !important; }
.box_skitter .progressbar { background:#000; position:absolute; top:5px;left:15px;height:5px; width: 200px; z-index:99; border-radius:20px; }
/* =Preview slide
-------------------------------------------------------------- */
.box_skitter .preview_slide { display:none; position:absolute; z-index:152; bottom:30px; left:-40px; width:100px; height:100px; background:#fff; border:1px solid #222; -moz-box-shadow:rgba(0,0,0,0.7) 2px 2px 5px; -webkit-box-shadow:rgba(0,0,0,0.7) 2px 2px 5px; box-shadow:rgba(0,0,0,0.7) 2px 2px 5px; overflow:hidden; }
.box_skitter .preview_slide ul { height:100px; overflow:hidden; margin:0; list-style:none; display:block; position:absolute; top:0; left:0; }
.box_skitter .preview_slide ul li { width:100px; height:100px; overflow:hidden; float:left; margin:0; padding:0; position:relative; display:block; }
.box_skitter .preview_slide ul li img { position:absolute; top:0; left:0; height:150px; width:auto; }
/* =Focus
-------------------------------------------------------------- */
#overlay_skitter { position:absolute; top:0; left:0; width:100%; z-index:9998; opacity:1; background:#000; }
.box_skitter .focus_button {position:absolute;top:50%;z-index:100;width:42px;height:42px;overflow:hidden;t ext-indent:-9999em;margin-top:-25px;background:url(../images/focus-button.png) no-repeat left top;opacity:0;}
.box_skitter .play_pause_button {position:absolute;top:50%;z-index:151;width:42px;height:42px;overflow:hidden;t ext-indent:-9999em;margin-top:-25px;background:url(../images/pause-button.png) no-repeat left top;opacity:0;}
.box_skitter .play_pause_button.play_button {background:url(../images/play-button.png) no-repeat left top;}
/* =Example for dimenions
-------------------------------------------------------------- */
.box_skitter_large {width:800px;height:300px;}
.box_skitter_small {width:200px;height:100px;}
-
Chechu
Si el problema es del CSS, seguro hablamos del código del sitio y no del recurso. Serviría que postees la URL en donde tenés el proyecto funcionando con el error. Saludos!
Normas de Publicación
- Vos no podés postear nuevos mensajes
- Vos no podés responder mensajes
- Vos no podés agregar adjuntos
- Vos no podés editar tus mensajes
-
Normas del Foro