Foros del Web » Creando para Internet » CSS »

Visualización con IE incorrecta

Estas en el tema de Visualización con IE incorrecta en el foro de CSS en Foros del Web. Buenas, primeramente decir que no se si esta duda va aqui en CSS o donde, pero creo que es el lugar más adecuado. Bueno os ...
  #1 (permalink)  
Antiguo 22/05/2009, 03:39
 
Fecha de Ingreso: mayo-2009
Mensajes: 2
Antigüedad: 14 años, 11 meses
Puntos: 0
Visualización con IE incorrecta

Buenas, primeramente decir que no se si esta duda va aqui en CSS o donde, pero creo que es el lugar más adecuado.

Bueno os comento, llevo toda la mañana intentando que mi página web (diariopc.es) se visualice bien en IE7 y no lo consigo. Como podeis observar no se ve el sidebar (utilizo wordpress) y la última noticia de abajo se ve cortada, sin embargo cuando entras en cualquier noticia (dandole click al titulo) ¡Vaya! todo se ve correctamente :S, no entiendo porque pasa... he intentado desactivar los widgets y mil cosas aun añadiendo el codigo

Cita:
<!--[if lt IE 7]>
<script src="ie7/IE7.js"
type="text/javascript">
</script>
<script src="ie7/IE7-squish.js"
type="text/javascript">
</script>
<![endif]-->
para que respete los estandares..aun asi se ve mal...no entiendo que puede ser..creo que el css a lo mejor...


Código:
/* STANDARD STYLING */
	html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td {
		margin: 0;
		padding: 0;
		border: 0;
		outline: 0;
		font-size: 100%;
	}
	body {
		color:#000; /* MAIN BODY TEXT COLOR */
		font-family:"Lucida Grande","Lucida Sans Unicode",Arial,Verdana,sans-serif; /* MAIN BODY FONTS */
		font-size:12px;
		font-size-adjust:none;
		font-style:normal;
		font-variant:normal;
		font-weight:normal;
		line-height:18px;
		background-repeat: repeat;
		background-attachment: fixed;
		background: #F7F8E0
 
;
	}

a {color:#0088CC;text-decoration: none;}
a:visited {color: #0088CC;}
a:hover {text-decoration: underline;}
p,.p {margin-bottom: 15px;}
img {border: none;}
ul li {	margin: 0px;}
ul {margin: 5px 0px 15px;padding-left: 20px;}
ol {margin: 5px 0px 15px;padding-left: 20px;}
form {margin: 0px;padding: 0px;}
small {	font-size: 90%;}
hr{border: none; border-bottom: 1px dotted #666;margin-bottom: 1em;}
blockquote{background: #f7f7f7; padding: 10px 15px;margin: 0 0 1em 2.5em;font-size:.9em;border: 1px solid #ddd;}

/* rounded borders */
	#nav, #sidebar .dbx-box, .post, #subnav, .page-nav{
		-moz-border-radius: 5px;
		-khtml-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
	}
	#searchform #s {
		-moz-border-radius: 10px;
		-khtml-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px;
	}
	#sidebar div.dbx-box{border: 1px solid #bbb;}
	#wrapper {width: 960px;margin: 0px auto;position: relative;}
	#header {padding: 15px 0;} /* Height of the header */

/* site title */
	h1.blogtitle {
		font-size: 39px; /* blog title size */
		float:left;
		line-height: 47px;
		position:relative;
	} 
	h1.blogtitle .sheen {
		position: absolute; 
		z-index: 5;
		background-color: transparent;
		background-image: url(images/sheen.png);
		background-position: 0 0;
		background-repeat: repeat-x;
		display: block;
		width:100%;
		height: 25px;
		float: left;
	}
	h1.blogtitle a{color: #000;}
	h1.blogtitle a:hover{color: #0088CC;text-decoration: none;}
	
	.description { 
		float: left;
		margin-top: 21px; 	/* description distance from top of screen */
		margin-left: 10px;
	}

/* search form */
	#searchform {
		width: 205px;
		float: right;
		font-size:12px;
		padding:0;
		margin:0;
	}
	#searchform #s{
		background: #ffffff url(images/form-field-bg.gif) no-repeat ;
		width: 158px;
		padding: 4px 7px 2px 5px;
		color: #999;
		border: 1px solid #888;
		margin:0;
		margin-top: 6px;
	}
	#searchform #searchsubmit { 
		background: url(images/search-button.png) no-repeat 0 0;
		height: 24px;
		width: 24px;
		border: none;
		cursor: pointer;
		text-indent: -999%;
		line-height: 1px;
		margin:0;
	}

/* HEADERS */
	h1, h2, h3, h4, h5, h6{color: #333;font-weight: normal;margin:0;padding: 0; line-height: 1.1em;}
	h1 a, h2 a, h3 a, h4 a, h5 a{color: #333;}

	h1{font-size: 32px;}
	h2{font-size: 28px;}
	h3{font-size: 24px;}
	h4{font-size: 20px;}
	h5{font-size: 16px;}
	h6{font-size: 12px;}


/* ------------------------------------- main content area  */
#page #wrapper #container #left-col {
	width: 675px;
	float: left;
}
/* main menu */
	#nav {
		font-size: 15px;
		border-bottom: 1px solid #999;
		background: #AAA url(images/navgrad-normal.png) repeat-x left top;

	}
	#nav small{display: none;} /* remove this later */
	#nav ul{
		list-style: none;
		display: block;
		margin: 0px 0px 0px 10px;
		padding: 0px;
		width: 600px;
		float: left;
	}
	#nav ul li{
		font-weight: bold;
		margin: 0px 5px 0px 0px;
		padding: 0px;
		float: left;
	}
	#nav ul li a{
		padding: 8px 10px 8px 10px;
		text-decoration: none;
		color: #222;
		display: block;
	}

	#nav .current_page_item a, #nav .current_page_item a:hover,#nav li a:active{
		text-decoration: none;	
		background: #2a2a2a url(images/navgrad-active.png) repeat-x top left;
		color: #fff;
	}
	 #nav li a:hover{
		color: #fff;
		background: #2a2a2a url(images/navgrad-hover.png) repeat-x top left;
	}
	 #nav li a:active{
		color: #fff;
		background: #2a2a2a url(images/navgrad-active.png) repeat-x top left;
	}



Aqui les dejo el css, pero creo que es todo correcto, yo ya no se que hacer, he intentado reducir los px del wrapper, los px del sidebar....puff :(

Espero puedan ayudarme, gracias. Un saludo

PD: Dejo el resto del css en el siguiente post.
  #2 (permalink)  
Antiguo 22/05/2009, 03:41
 
Fecha de Ingreso: mayo-2009
Mensajes: 2
Antigüedad: 14 años, 11 meses
Puntos: 0
Respuesta: Visualización con IE incorrecta

Aqui esta el resto del codigo:

Código:
/* sub menu */
#subnav { background: #fff url(images/agradient-30light.gif) repeat-x top left;;margin-top: 15px;border: 1px solid #ddd}
#subnav ul {
	margin: 0px;
	padding: 0px 0px 0px 5px;
	list-style: none;
}
#subnav li {
	border-right: 1px solid #D8D8D8;
	padding: 4px 7px;
	margin: 0px;
	float: left;
}
#subnav li a, #subnav li a:visited, #subnav .page_item {
	text-decoration: none;
	color: #333333;
}
#subnav .current_page_item a, #subnav .current_page_item a:visited {
	color: #3b9acc;
}
#subnav li a:hover {
	text-decoration: none;
	color: #3b9acc;
}

#subnav ul li ul li{display: none;}
/* content */
#content {
	clear: both;
	overflow: hidden;
	margin-top: 15px;
}
.post {
	border: 1px solid #bbb;
	background: #FFF;
	padding: 25px 25px 15px 25px;
	clear: both;
	overflow: hidden;
	padding-bottom: 1em;
	margin-bottom: 2em;
}
.post .date {
	height: 50px;
	width: 45px;
	background: url(images/calendar.gif) no-repeat;
	font: normal 22px Arial, Helvetica, sans-serif;
	color: #666666;
	text-align: center;
	padding: 0px 2px 0 0;
	line-height: 100%;
	float: left;
}
.post .date span {
	height: 16px;
	display: block;
	font: normal 11px Arial, Helvetica, sans-serif;
	color: #ffffff;
	text-align: center;
	padding-top: 7px;
}
.post .title {
	float: left;
	margin-left: 10px;
	width: 558px;
}
.postdata {
	font-size: 90%;
	color: #999999;
}
.postdata a, .postdata a:visited {
	color: #999999;
	text-decoration: none;
}
.postdata a:hover {
	color: #0088CC;
	text-decoration: none;
}
.postdata .category{
	float: left;
}
.postdata .comments{
	float: right;
}
.mini-add-comment {
	background: url(images/mini-down-arrow.gif) no-repeat left center;
	padding-left: 12px;
	float: right;
}
.entry {
	padding: 15px 0px 5px;
	clear: both;
	font-size: 14px;
	line-height: 1.6em;
	margin-bottom: 1em;
}

/* post title */
h2.posttitle {
	color: #000;
	margin: 3px 0 2px;
	padding-bottom: 4px;
	font-size: 24px;
	border-bottom: dotted 1px #CCCCCC;
}
h2.posttitle a, h2.posttitle a:visited {
	color: #000;
	text-decoration: none;
}
h2.posttitle a:hover {
	color: #0088CC;
	text-decoration: none;
}
.tags {
	float: right;
	display: block;
	color: #000000   ;
}
.tags a{font-weight: bold;color: #0066CC;}
.tags a:hover{color:#0099CC   ;text-decoration: none;}

/* next & previous page navigation */
.page-nav {
	clear: both;
	margin-bottom: .6em;
	background: #e5e5e5 url(images/agradient-30.gif) repeat-x left top;
}
.page-nav a, .page-nav a:visited {
	color: #000;
	text-decoration: none;
}
.page-nav a:hover {
	color: #fff;
	text-decoration: none;
}
.previous-entries a {
	float: left;
	padding-left: 10px;
	margin-left: 10px;
	background: url(images/navigation-left.gif) no-repeat left center;
}
.next-entries a {
	float: right;
	padding-right: 10px;
	margin-right: 10px;
	background: url(images/navigation-right.gif) no-repeat right center;
}

/* next & previous post navigation */
.post-nav {
	clear: both;
	padding-bottom: 35px;
	margin-top: 15px;
	font-size: 95%;
}
.post-nav a, .post-nav a:visited {
	color: #999999;
	text-decoration: none;
}
.post-nav a:hover {
	color: #000000;
	text-decoration: none;
}
.post-nav .previous a {
	float: left;
	padding-left: 20px;
	background: url(images/post-nav-previous.gif) no-repeat left center;
}
.post-nav .next a {
	float: right;
	padding-right: 20px;
	text-align: right;
	background: url(images/post-nav-next.gif) no-repeat right center;
}

/* ------------------------------------- comment area  */
h3#comments {
	background: url(images/comments.gif) no-repeat;
	padding-left: 22px;
	font: normal 140%/120% Arial, Helvetica, sans-serif;
	clear: both;
}
h3#respond {
	background: url(images/icons/edit.png) no-repeat;
	padding-left: 22px;
	font: normal 140%/120% Arial, Helvetica, sans-serif;
	margin: 20px 0px 0px;
	clear: both;
}
/* commentform */
#commentform {
	margin-top: 10px;
}
#commentform label {
	font-weight: bold;
	color:#666;
	font-size: 100%;
	padding-left: 5px;
}
#commentform small {
	color: #999999;
	font-size: 90%;
}

#commentform textarea {
	font: 110% Arial, Helvetica, sans-serif;
	width: 480px;
	height: 140px;
	background:url(images/form-field-bg.gif) no-repeat;
	border: solid 1px #e6e6e6;
	padding: 5px 3px 3px 7px;
}

#commentform textarea:focus, #commentform input[type="text"]:focus {
	border: solid 1px #999;
}

/* comment list */
.commentlist {
	margin: 10px 0px;
	padding-left: 45px;
	line-height: 130%;
}
.commentlist li{
	padding: 5px 10px;
}
.commentlist .alt {
	background: #F4F4F4;
}
.commentlist cite {
	font-weight: bold;
	font-style: normal;
	font-size: 110%;
	color: #0088CC;
}
.commentlist cite a, .commentlist cite a:visited {
	color: #0088CC;
}
img.avatar {
  float: right;
  margin: 5px;
  }
.commentlist small {
	margin-bottom: 5px;
	display: block;
	font-size: 87%;
}
.commentlist small a, .commentlist small a:visited{
	color: #999999;
}

/* ------------------------------------- cred area  */
#cred {
	padding: 0px 0px 0px 0px;
	clear: both;
}

#cred .designer a{
	
	font-size: 1.1em;
	color: #000;
	padding-left: 22px;
	float: left;
	background: url(images/pagelines-icon.gif) no-repeat 3px 0px;
}

#cred a:hover {
	text-decoration: underline;
}

/* @ FORMS */
	legend{display: none;}
	fieldset{border:none;background: transparent;}
		
	/* commentform */
	label {
		color:#333;
		font-size: .9em;
		display: block;
	}
	small {
		color: #555;
		font-size: 90%;
	}
	input{
		font: 110%  arial, helvetica;

		padding: 5px 3px 3px 5px;
		background: url(images/form-field-bg.gif) no-repeat;
		border-top: 1px solid #ccc;
		border-right: 1px solid #aaa;
		border-bottom: 1px solid #aaa;
		border-left: 1px solid #ccc;
	}
	
	 textarea {
		font: 110% courier, arial, helvetica;
		height: 140px;
		background:url(images/form-field-bg.gif) no-repeat;
		border-top: 1px solid #ccc;
		border-right: 1px solid #aaa;
		border-bottom: 1px solid #aaa;
		border-left: 1px solid #ccc;
		padding: 5px 3px 3px 7px;
	}

	textarea:focus, input[type="text"]:focus {
		border: solid 1px #666;
	}
	
	
	.button, input[type="submit"], .submit {
		border: 1px solid #aaa;
		background: #e5e5e5 url(images/agradient-30light.gif) repeat-x left top;
		margin:0;
		font-weight: bold;
		font-family: arial, helvetica;
	}
	.button:hover, input[type="submit"]:hover{color: #0088CC;}
	.button:active, input[type="submit"]:active{background: #e5e5e5 url(images/agradient-30.gif) repeat-x left top; color: #000;}



/* sidebar */
#sidebar {
	margin-top: 15px;
	float:right;
	width: 260px;
	color: #666666;
	line-height: 160%;
}
#sidebar .dbx-box
#sidebar p {
	margin: 0px 0px 15px;
}
#sidebar h3 {
	font: bold 12px/100% Arial, Helvetica, sans-serif;
	color: #444;
}
#sidebar h3:hover{color: #000;}
#sidebar h3 a, #sidebar h3 a:visited {
	color: #333;
}
#sidebar h3 img {
	vertical-align: middle;
}
#sidebar a, #sidebar a:visited {
	color: #000000;
	text-decoration:none;
}
#sidebar a:hover, #sidebar a:focus, #sidebar a:active {
	text-decoration:underline;
}
#sidebar ul {
	list-style: none;
	margin: 0 ;
	padding: 0 ;
}
#sidebar ul li {
	background-image: url(images/icons/bullet_black.png);
	background-repeat: no-repeat;
	padding-left: 22px ;
	background-position: 0 1px;
}
#sidebar ul li ul li {
	background-image: url(images/bullet_black.png);
	background-repeat: no-repeat;
	padding-left: 12px ;
}

#archives ul li {
	background-image: url(images/icons/calendar_view_month.png);
	background-repeat: no-repeat;
}

#recent-comments ul li {
	background-image: url(images/icons/comment.png);
	background-repeat: no-repeat;
}

#recent-posts ul li {
	background-image: url(images/icons/page_copy.png);
	background-repeat: no-repeat;
}
#categories ul li {
	background-image: url(images/icons/folder.png);
	background-repeat: no-repeat;
	background-position: 0 2px;
}

/* meta */
#meta .rss {
	background: url(images/icons/feed.png);
	background-repeat: no-repeat;
}
#meta .check {
	background: url(images/comment.gif);
	background-repeat: no-repeat;
}
/* calendar */
#calendar table {
	margin: 0px auto;
}
#calendar td {
	padding: 0px 4px;
}

/* alignments */
img.center, img[align="center"] {	display: block;	margin-left: auto;	margin-right: auto;}

img[align="left"] {float:left;margin: 2px 10px 5px 0px;}

img[align="right"] {float:right; margin: 2px 0px 5px 10px;}
.clear {clear:both;}
hr.clear {clear:both;visibility: hidden;margin: 0px;padding: 0px;}


.wp-caption {
	text-align: center;
	margin: 10px;
	-moz-border-radius: 3px;
	-khtml-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	background: #fff;
	text-align: center;
	padding: 4px;
	margin-bottom: 1em;
}
.wp-caption-text {font-size: 10px;margin:0;padding:6px 3px 2px;line-height: 16px;}
.wp-caption img {margin: 0;	padding: 0;	border: 0 none;margin-top: 5px;	}
.wp-caption-dd {font-size: 11px;line-height: 17px;	padding: 0 4px 5px;	margin: 0;	}


/* @ STANDARD ELEMENTS */	
	img#wpstats{width:0px;height:0px;overflow:hidden;}
	
	.border{ padding: 2.5px;	border: 1px solid #ccc;}
	.hidden {display: none; visibility: hidden;}
	.aligncenter {display: block;margin-left: auto;margin-right: auto;}
	.alignleft {float: left;margin:0 10px 5px 0;}
	.alignright {float: right;margin:0 0 5px 10px;}
	

/* FLOATING AND ALIGNMENT */
	.floatleft{float:left;margin:3px 7px 0 0;}
	.floatright{float:right;margin:3px 0 0 7px;}
	.right{float:right;}
	.block{display:block;}
	.left{float:left;}
	.clear{clear:both;}
	.center {text-align: center;}
  #3 (permalink)  
Antiguo 22/05/2009, 05:24
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 16 años, 10 meses
Puntos: 539
Respuesta: Visualización con IE incorrecta

Cita:
se visualice bien en IE7 y no lo consigo
Cita:
<!--[if lt IE 7]>
lt = menor que // <!--[if lt IE 7]> (menor que IE 7)
lte= menor o igual que // <!--[if lte IE 7]> (menor o igual que IE 7)


Aquí tienes la lista de los cc

Mira a ver si corrigiendo eso se arregla. Si no es así, comenta de nuevo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 16:28.