28172 sujets

CSS et mise en forme, CSS3

Positionnement div sous firefox

Bonjour

Je me suis servi d'un tuto de ce site pour la mise en page de ma page d'accueil :
http://css.alsacreations.com/Faire-une-mise-en-page-sans-tableaux/Maitriser-le-positionnement-CSS-dans-toutes-les-situations#choix

#conteneur {width:760px; margin:0 auto;}
#wrap {overflow:hidden;}
#sidebar {float:left; width:170px;}
#contenu {margin-left:170px;}


Le problème est que cette mise en page fonctionne sous IE mais pas sous FF. Les div contenues dans wrap ne s'affiche pas. Pourtant elles ont un contenu...
Qu'en pensez vous? Smiley langue
Bonjour poumon2312,

Peut-on voir ton code dans son intégralité ou mieux une page en ligne ?En l'état, il n'y a pas grand chose à dire puisque le code du tutoriel est, pour sa part, parfaitement fonctionnel...


Cdt,
Sylvain
Oui bien sur. Voila le CSS

/*Général*/
body  {
	font-family : Verdana;
	margin : 0;
	padding : 0;
	background-color: #D2C8B8;
	height:100%;
	width:100%
}
img {
	border : none;
	margin : 0;
	behavior: url(./iepngfix/iepngfix.htc);
	}

.logo {
	margin:10px 10px 10px 10px;
}

/*Menu du haut*/
#page {width:100%; height:100%;}

div#menutop {
	height : 10%;
	width:100%;
	left: 0px;
	top: 0px;
	}
div#menutop ul {
	position : absolute;
	top : 35px;
	left: 200px;
	height:10px;
	margin: 0px;
	list-style-type : none;
	white-space : nowrap;
	}
ul li {
	float:left;
	}
#menutop ul li img{
}
#menutop ul li a {
	display:block;
	color : #fff;
	text-decoration : none;
	text-align : center;
	font-size : 14px;
	line-height: 30px;
	cursor : pointer;
	background : url(../images/onglet.png);
	padding-left:20px;
	padding-right: 20px;
	}
#menutop li a:hover {
	color: #000;
	background : url(../images/ongletHover.png);
	}
#conteneur {
	overflow:hidden;
}
div#contenu {
	margin-left: 250px;
}
div#carte {
	top:0px;
	left:0px;
	height:80%;
}
div#listePoints {
	background-color:black;
}

et

#menuarbo {
	float:left;
	width:200px;
}
#menuarbo object {
	height:90%;
}


Le HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
  "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" 
      xmlns:v="urn:schemas-microsoft-com:vml">


  <head>
		<title></title>
		<link rel="stylesheet" type="text/css" href="./CSS/MainStyle.css" />
		<link rel="stylesheet" type="text/css" href="./CSS/ArboStyle.css" />
  </head>
  
  <body onload="initialize()" onunload="GUnload()">
  	<!--Mise en place du menu du haut-->
<div id="page">
    <div id="menutop">
		<img class="logo" src="./images/logo100px.png"></img>
		<ul>
			<li><img src="./images/CoteGaucheBarre.png"></li>
			<li><img src="./images/CoteDroitBarre.png"></li>
		</ul>        
    </div>

<!--Mise en place du menu de gauche-->
	<div id="conteneur">
			<div  id="menuarbo"> 
				<object 
				  classid="java:menuArbo.AppletArbo"
				  codebase="./"
				  codetype="application/x-java-applet;version=1.5.0"
				  archive="MenuArbo.jar"
				  width="200"
				  >
					<param name="archive" value="MenuArbo.jar">
					<param name="code" value="menuArbo.AppletArbo">
					<param name="mayscript" value="yes">
					<param name="scriptable" value="true">
					<param name="name" value="jsapplet">
					<param name="selection" value="">
					<?php echo "<param name=\"SID\" value=\"".session_name()."=".session_id()."\">" ?>

				</object>
			</div>
				<div id="contenu">
					<div id="carte"></div>
					<div id="listePoints"></div>
			</div>
		</div>	
		</div>
	</body>
  
</html>


J'ai essayé de réduire au max avant le copier/coller.
Sujet clos
Aller à