Problema de desplazamiento en IE al visualizar página web

  • Autor Autor rai
  • Fecha de inicio Fecha de inicio
R

rai

Gamma
Social Media
hola, estoy haciendo Enlace eliminado pagina, y viendola en firefox y chrome se ve bien, pero cuando entro en ie, la pagina principal se desplaza a la derecha, el interior se sigue viendo bien.
y no se como solucionarlo,

gracias

He coseguido arreglar algunas cosas, pero sigo si poder cuadrar los cuadrados al marcar un link
pongo el codigo

PHP: 
<?php 
/*
Template Name: principal*/
?>

<title></title>
<script type="text/javascript" src="http://localhost//wp-content/themes/eNews/files/jquery.js"></script>
<script type="text/javascript" src="http://localhost//wp-content/themes/eNews/files/akscript.js"></script>

<meta name="generator" content="WordPress 3.2">

<link rel="stylesheet" type="text/css" media="all" href="http://localhost//wp-content/themes/eNews/files/style.css">

<body class="home blog" onclick="if(stWidget.buttonClicked==false){stWidget.stopClosing=false;stWidget.openDuration=0;stWidget.stClose(100);}">

<style type="text/css">

	body {background: url(http://localhost//wp-content/themes/eNews/files/background_img.png) repeat-x left top;}

</style>




	<div id="body-wrapper">
    
	<div id="container">    		 <script type="text/javascript">
	$j(document).ready(function(){
							   
		var fwItems = new Array();
		var boxs = new Array();
		var boxActive = new Array();
		for($n=0;$n<13;$n++){
			boxs[$n] = $j("#lp-rollover-box-"+$n);
			boxs[$n].css({ opacity: 0 });
		}
		for($a=0;$a<7;$a++){
			boxActive[$a] = $j("#lp-rollover-boxactive-"+$a);
			boxActive[$a].css({ opacity: 0 });
		}
		
		
		$j(".lp-rollover-boxactive").hover(
						  
			function(){	
				for(var i in boxs) {
					boxs[i].stop(true, false).fadeTo(250, 0.7)
				}
				for(var i in boxActive) {
					if(boxActive[i].attr('id')!=$j(this).attr('id')){
						boxActive[i].stop(true, false).fadeTo(250, 0.7)
					}
				}
			},
			function(){	
				for(var i in boxs) {
					boxs[i].stop(true, false).fadeTo(250, 0)
				}	
				for(var i in boxActive) {
					boxActive[i].stop(true, false).fadeTo(250, 0)
				}			
			}
		)
		boxActive[0].delay(1000).fadeTo(500, .7).fadeTo(1000, 0);
		boxActive[1].delay(1300).fadeTo(500, .7).fadeTo(1000, 0);
		boxActive[2].delay(1600).fadeTo(500, .7).fadeTo(1000, 0);
		
		boxActive[4].delay(2200).fadeTo(500, .7).fadeTo(1000, 0);
		boxActive[5].delay(2500).fadeTo(500, .7).fadeTo(1000, 0);
		boxActive[6].delay(2800).fadeTo(500, .7).fadeTo(1000, 0);
	})
	
	</script>
    <ul id="lp-rollover">
    	
        <a href="http://localhost/?page_id=7/">
            <li id="lp-rollover-boxactive-0" class="lp-rollover-boxVert lp-rollover-boxactive" style="opacity: 0; ">
                <ul class="lp-rollover-inner">
                    <li class="lp-rollover-box row-end"></li>
                    <li class="lp-rollover-box row-end"></li>
                </ul>
            </li>
        </a>
        
        <li id="lp-rollover-box-0" class="lp-rollover-box" style="opacity: 0; "></li>
        <li id="lp-rollover-box-1" class="lp-rollover-box" style="opacity: 0; "></li>
        <li id="lp-rollover-box-2" class="lp-rollover-box" style="opacity: 0; "></li>
        
        <a href="http://localhost/r/?page_id=10/">
        	<li id="lp-rollover-boxactive-1" class="lp-rollover-box lp-rollover-boxactive" style="opacity: 0; "></li>
        </a>
        
        <li id="lp-rollover-box-logo" class="lp-rollover-boxLogo"></li>
        <li id="lp-rollover-box-3" class="lp-rollover-box" style="opacity: 0; "></li>
        
        <a href="http://localhost//?page_id=2/">
            <li id="lp-rollover-boxactive-2" class="lp-rollover-boxHoriz lp-rollover-boxactive" style="opacity: 0; ">
                <ul class="lp-rollover-inner">
                    <li class="lp-rollover-box"></li>
                    <li class="lp-rollover-box row-end"></li>
                </ul>
            </li>
        </a>
        
        <li id="lp-rollover-box-4" class="lp-rollover-box" style="opacity: 0; "></li>
        <li id="lp-rollover-box-5" class="lp-rollover-box" style="opacity: 0; "></li>
        <li id="lp-rollover-box-6" class="lp-rollover-box row-end" style="opacity: 0; "></li>
        <li id="lp-rollover-box-7" class="lp-rollover-box" style="opacity: 0; "></li>
        <li id="lp-rollover-box-8" class="lp-rollover-box" style="opacity: 0; "></li>
        
        <a href="http://localhost//?page_id=2222/">
            <li id="lp-rollover-boxactive-3" class="lp-rollover-boxVert lp-rollover-boxactive" style="opacity: 1; ">
                <ul class="lp-rollover-inner">
                    <li class="lp-rollover-box row-end"></li>
                    <li class="lp-rollover-box row-end"></li>
                </ul>
            </li>
        </a>
        
        <a href="http://localhost//?page_id=7/" id="btn-menu06">
            <li id="lp-rollover-boxactive-4" class="lp-rollover-boxHoriz lp-rollover-boxactive" style="opacity: 0; ">
                <ul class="lp-rollover-inner">
                    <li class="lp-rollover-box"></li>
                    <li class="lp-rollover-box row-end"></li>
                </ul>
            </li>
        </a>
        
        <li id="lp-rollover-box-9" class="lp-rollover-box" style="opacity: 0; "></li>
        <li id="lp-rollover-box-10" class="lp-rollover-box" style="opacity: 0; "></li>
        
        <a href="http://localhost//?page_id=10/" id="btn-menu05">
            <li id="lp-rollover-boxactive-5" class="lp-rollover-boxHoriz row-end lp-rollover-boxactive" style="opacity: 0; ">
                <ul class="lp-rollover-inner">
                    <li class="lp-rollover-box"></li>
                    <li class="lp-rollover-box row-end"></li>
                </ul>
            </li>
        </a>
        
        <li id="lp-rollover-box-11" class="lp-rollover-box" style="opacity: 0; "></li>
        
        <a href="http://localhost//?page_id=13/" id="btn-menu07">
            <li id="lp-rollover-boxactive-6" class="lp-rollover-boxHoriz lp-rollover-boxactive" style="opacity: 0; ">
                <ul class="lp-rollover-inner">
                    <li class="lp-rollover-box"></li>
                    <li class="lp-rollover-box row-end"></li>
                </ul>
            </li>
        </a>
        
        <li id="lp-rollover-box-12" class="lp-rollover-box row-end" style="opacity: 0; "></li>
    </ul>
    
	<ul id="bucket-list">
    	<img src="http://localhost//wp-content/themes/eNews/files/lp_image.jpg">
    
    
    </ul>
    <div id="lp-mainnav-area">
    	<ul id="main-nav">
        	
<li class="page_item page-item-136"><a href="http://localhost//?page_id=29/" title="vip events">Vip Events</a></li>
<li clas
    </ul></div>
    

   </div></div>
   </body>
   </html>


y este el css

PHP: 
/*
Theme Name: 
Theme URI: http://brossa.eshost.es
Author: Estudio Brossa
Version: 1.0
Tags:
*/



@font-face {
	font-family: HelveticaNeue;
	src: url('HelveticaNeue.ttf');
}

a img{
	border:none;	
}

* {margin: 0px; padding: 0px;}
a {text-decoration: none; color: #689bb5;}
a:hover {color: #343434;}
a:focus, a:active, input {outline: 0; -moz-outline: none;} 
.cloaker {display: none;}
p, h1, h2, h3, li {font-family: Arial, Helvetica, sans-serif;}

/* layouts and frames */
#body-wrapper {margin: 0px auto; padding: 40px 0px 0px 45px; width: 1056px;}
#container {background: url http://brossa.eshost.es/wp-content/themes/eNews/files/container_bg_img.png no-repeat left top; }

#bucket-list { 
	width: 1026px; 
	height:585px;
	list-style: none; 
	float: left;
	background-color:#FFF;
	z-index:1000;
	position:absolute;
	-moz-box-shadow: 0px 0px 5px #5c6b72;
	box-shadow: 0px 0px 3px 3px #b4bfc5;
	-webkit-box-shadow: 0px 0px 5px #5c6b72;
}


#subnav-area {margin-top:90px;}
.subnav-area-contact{float:right;font-size:12px;}
#subnav-area a{height:20px !important; color:#FFF !important; text-align:right;margin-right:10px;}
#subnav-area div{}








/* styles and cosmetics */


.row-end {margin-right: 0px !important;}
.col-end {margin-bottom: 0px !important;}
.row-top {height:143px !important;}






#lp-mainnav-area{	
	float:right;
	position:relative;
	top:585px;
	margin-right: 250px;
}
#lp-mainnav-area #main-nav{
	margin-left: 10px; margin-top: 5px; list-style: none;
	display:inline-block;
}



.lp-latest-news-jpg{
	width:144px !important;	
}
#lp-rollover{
	width: 1026px; 
	list-style: none; 
	float: left;
	z-index:1001;
	position:absolute;
	height:585px;
}
.lp-rollover-inner{
	list-style: none; 
}
.lp-rollover-boxVert{
	margin-right: 3px; margin-bottom: 3px; height: 291px; width: 144px; float: left;
}
.lp-rollover-boxHoriz{
	margin-right: 3px; margin-bottom: 3px; height: 144px; width: 291px; float: left;
}
.lp-rollover-box{
	margin-right: 3px; margin-bottom: 3px; height: 144px; width: 144px; float: left;background:#000;
}
.lp-rollover-boxLogo{
	margin-bottom: 3px; height: 144px; width: 291px; float: left;
}
.lp-rollover-boxactive{
	cursor:pointer;	
}
#lp-rollover-boxactive-4{
	position:absolute;top:441px;
}



#main-menu-list {width: 100%; list-style: none; text-align: right;}
#main-menu-list li {margin: 0px; width: 100%; height: 18px; text-align: right;}
#main-menu-list li a {margin: 0px; width: 100%; height: 18px; font-size:20px; text-align: right; text-decoration: none; color: #fff; text-transform: uppercase;}

#btn-active-area {width: 291px !important; height: 122px !important; float: right;} 

#main-nav {margin-left: 10px; margin-top: 10px; list-style: none; float: left;}
#main-nav li {margin-right: 10px; padding-left: 10px;  float: left; border-left: 1px solid #b42f32; line-height: 8px; vertical-align: middle;display:inline-block;}
#main-nav li {line-height: normal\9;}
#main-nav li:first-child{border-left:none;margin-left:5px;padding-left:0;}
#main-nav li a {font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; text-transform: uppercase; text-decoration: none; color: #756477; vertical-align: middle;}
#main-nav li a:hover {color: #343434;}

gracias
 
Última edición:
#main-menu-list {width: 100%; list-style: none; text-align: right;}

Si lo pones en center creo se soluciona, aunque tal vez tengas un div no centrado y que no cerraste, intenta con eso


#main-menu-list {width: 100%; list-style: none; text-align: rcenter;}

Y se debe adecuar al ie, de eso busca info en la web del template o en la web de validacion css.
 
me estaba volviendo loco,
ya he conseguido solucionarlo, el problema era que habia creado un template nuevo y no habia metido el header, y al no meter el header no estaba descritto el doctype, todo fue ponerlo y de maravilla
 
Gracias 🙂
 
Hay que estar conectado o registrado para responder aquí.

Temas similares

richardx
Problema con desplazamiento en mi web móvil
Respuestas
5
Visitas
290
richardx
richardx
RedxLus
Problema con desplazamiento en web: SCROLL intermitente
Respuestas
3
Visitas
416
RedxLus
RedxLus
I
Problema con desplazamiento en web (Firefox Android)
Respuestas
4
Visitas
256
igorsp
I
kahlo
Problema de desplazamiento del sidebar al usar caja de comentarios de Facebook
Respuestas
3
Visitas
715
Plaga
Plaga
Atrás
Arriba