Problema posizione elementi

**guinness86** · 15-05-2012, 10:22

Salve a tutti, sto realizzando un piccolo sito www.eda-gg.it ma sto avendo innumerevoli problemi con internet explorer.
Infatti se il sito che ho scritto viene visualizzato con Safari, Mozilla, Chrome sia su Mac che su Windows funziona bene, se invece lo apro con Internet Explorer mi da una marea di problemi di posizionamento degli elementi.
Vi mostro il codice css per tutti i browser:

codice:

body{
font-family: Arial, Helvetica, sans-serif;
}

#lingua{
	float:left;
	width: 30%;
	color: #fff;
	margin-top: 10px;
	margin-left: 70%;
	text-align:right;
	font-family: Arial, Helvetica, sans-serif;
	text-transform: uppercase;
		font-size:13px;
	
	
}

#area_riservata{
	float:left;
	width: 13%;
	color: #fff;
	margin-top: 5px;
	margin-left: 87%;
	padding-top:5px;
	padding-bottom:5px;
	padding-right: 5px;
	text-align:right;
	font-size:13px;
	background: #ff6400;
	font-family: Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	
	
	
}

#contenuto{
	
	width:450px;
	color: #fff;
	height:470px;
	background-color:rgba(0,0,0,0.6);
	margin-left:-8px;	
	margin-top:-8px;
	border-bottom-right-radius: 10px;
	font-family: Arial, Helvetica, sans-serif;
	
	
}

#scritta{

font-family: Arial, Helvetica, sans-serif;
text-transform: uppercase;
padding-left: 190px;
padding-top: 5%;
/*padding-bottom: 20%;*/
line-height: 25px;
font-weight: bold;


}

#subtitle{
	font-family: Arial, Helvetica, sans-serif;
	margin-left: 41%;
	margin-top: -4%;
	color: #cecece;
	font-weight: bold;
	font-size: 7.8pt;
	
}

#logo{
	margin-left:40%;
	padding-top: 15%;
	
}

#crediti{
	font-size: 10px;
	padding-left: 180px;
	margin-top: 0%;
	padding-bottom: 3%;
	font-family: Arial;
	color: #fff;
}

#costruzione{
	
	float: right;
	margin-top: -30px;
	margin-right: 4%;
	color: #ff6400;
	font-weight: bold;
	font-size: 20px;
	font-family: Arial, Helvetica, sans-serif;

}

In pratica su IE non riesco a visualizzare gli elementi #costruzione, #lingua e #area_riservata.
Quale potrebbe essere la soluzione?
Grazie!

**KillerWorm** · 15-05-2012, 20:49

Ciao,
ho dato uno sguardo veloce al tuo css e sembrerebbe ok.
Ti faccio giusto una domanda. Hai inserito il DOCTYPE nella tua pagina html? Spesso il problema dipende proprio da questo.

Ad ogni modo è possibile che dipenda da una sintassi errata del codice html piuttosto che dal css.
Nel caso sarebbe opportuno postare anche il codice html per capire meglio (perlomeno la parte interessata).

**guinness86** · 15-05-2012, 21:52

Ecco il codice HTML della paginetta...non riesco a comprendere perchè funziona su tutti i browser tranne su IE...

codice:

 

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>edaGG - !Under Construction</title>
<!--[if IE]>
 
<link rel="stylesheet" type="text/css" href="stile_ie.css" />

 
 <![endif]-->  

<link rel="stylesheet" type="text/css" href="sorgenti/bgstretcher.css" />

<script type="text/javascript" src="sorgenti/jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="sorgenti/bgstretcher.js"></script>
<script type="text/javascript" src="sorgenti/main.js"></script>

<script type="text/javascript">
	$(document).ready(function(){
	
        //  Initialize Backgound Stretcher	   
		$('BODY').bgStretcher({
			images: ['immagini/imm1.png', 'immagini/imm2.png', 'immagini/imm3.png', 'immagini/imm4.png', 'immagini/imm5.png', 'immagini/imm6.png', 'immagini/imm7.png', 'immagini/imm8.png', 'immagini/imm9.png'],
			imageWidth: 1440, 
			imageHeight: 900, 
			slideDirection: 'N',
			slideShowSpeed: 3000,
			transitionEffect: 'fade',
			sequenceMode: 'normal',
			buttonPrev: '#prev',
			buttonNext: '#next',
			pagination: '#nav',
			anchoring: 'left center',
			anchoringImg: 'left center'
		});
		
	});
</script>



</head>


<body>
    <div id="page" style="display: none_;">
		
		<div id="lingua">
		Ita - Eng
		</div>
		<div id="area_riservata">
		Reserved Area   >
		</div>
		
		
		
		

		<div id="contenuto">
	
		<div id="logo">
		[img]logo/logoedaGG.png[/img]
		
		</div>
		<div id="subtitle">
		<font color="#ff6400">e</font>ngineering<font color="#ff6400">d</font>esign<font color="#ff6400">a</font>rchitecture<font color="#ff6400">G</font>iampaolo<font color="#ff6400">G</font>rasso

		</div>
	
		
		<div id="scritta">
		about
		

		project
		

		network
		

		pubblications
		

		contact
		

		</div>
		
		
		

		
		</div>
		<div id="crediti">
		
		edaGG - Copyright © 2012

		powered by Orazio Fiorini
		</div>
		
		
		
		</div>
		
		<div id="costruzione">
		!UNDER CONSTRUCTION!
		</div>
		
		
		
			
		
	
	
</body>
</html>

**Prill** · 16-05-2012, 16:05

Explorer 9, senza il css per ie, visualizza i vari elementi nella stessa posizione di Firefox.

Discussione: Problema posizione elementi

Strumenti discussione

Ricerca discussione

Visualizza

Problema posizione elementi

Permessi di invio