Problème Scrollbar sous Firefox

Question

Vinix

23 Oct 2006 à 23:32

Bonjour,

Je travaille actuellement sur un site dont vous pouvez visualisez la page à cette adresse www.virginiegarnier.com/societe.htm
J'ai intégré une barre de défilement à l'intérieur du site avec les div et cela marche très bien sous IE mais par contre ma barre ne s'affiche pas sous Firefox.
J'ai cherché, cherché mais en vain. Je ne sais pas quoi faire pour corriger ce bug.

Merci de votre aide

Voici le code HTML


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>APSAC</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<LINK rel="stylesheet" type="text/css" href="style.css">

</head>

<body>

	<div id="global">
	
		<div id="bloc1"></div>
			
		<div id="bloc2">
			<div id="rubrique_accueil"><a href="accueil.htm" title="Accueil"><img src="images/rubrique_accueil.gif" width="124px" height="32px" /></a></div>
			<div id="accueil_contact">
				<img src="images/accueil_contact.gif" width="150px" height="30px" usemap="#Map" /> 
					<map name="Map">
						<area shape="rect" coords="0,0,74,34" href="accueil.htm">
						<area shape="rect" coords="76,0,151,36" href="contact.htm">
					</map>
			</div>
		</div>
			
		<div id="bloc3">
			<div id="rubrique_societe"><a href="societe.htm" title="Société"><img src="images/rubrique_societe.gif" width="124px" height="32px" /></a></div>
			<div id="titre"><img src="images/titre_societe.gif" width="200px" height="30px" /></div>
			<div id="photo_entreprise"><img src="images/entreprise.jpg" alt="Photo entreprise" width="270px" height="102px" /></div>
		</div>
			
		<div id="bloc4">
			<div id="rubrique_pole_composites"><a href="pole_composites.htm" title="Pôle Composites"><img src="images/rubrique_pole_composites.gif" width="124px" height="32px" /></a></div>
		</div>
			
		<div id="bloc5">
			<div id="rubrique_pole_design"><a href="pole_design.htm" title="Pôle Design"><img src="images/rubrique_pole_design.gif" width="124px" height="32px"/></a></div>
			<div id="rubrique_contact"><a href="contact.htm" title="Contact"><img src="images/rubrique_contact.gif" width="62px" height="32px" /></a></div>
		</div>
			
		<div id="bloc6">
			<div id="frame">
				<div id="anim_accueil">
					<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="560px" height="100px">
						<param name="movie" value="qualite.swf">
						<param name="quality" value="high">
						<param name="wmode" value="transparent">
						<embed src="qualite.swf" quality="high" wmode="transparent" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="560px" height="100px"></embed>
					</object>
				</div>
				<div id="bloc_1_titre">
					<ul>
						<li>Présentation de la Société</li>
					</ul>
				</div>
				<div id="bloc_1_texte">
					Située en région Rhône-Alpes, <span class="gras_bleu">APSAC</span> fait parti du groupe REX Composites/ISSOIRE Aviation basé à Issoire (63), sous-traitant aéronautique et producteur propre d'avion école(APM Lion et Lionceau).
					<br />
					La société <span class="gras_bleu">APSAC</span> est spécialisée dans la sous-traitance de mise en œuvre des matériaux composites. 
				</div>
				<div id="logos">
					<table>
						<tr>
							<td><img src="images/logo_rex.gif" /></td>
							<td><img src="images/logo_issoire.gif" /></td>
							<td><img src="images/logo_2ac.gif" /></td>
							<td><img src="images/logo_airflo.gif" /></td>
							<td><img src="images/logo_scit.gif" /></td>
						</tr>
					</table>
				</div>
				<div id="bloc_2_titre">
					<ul>
						<li>Secteurs d'activité</li>
					</ul>
				</div>
				<div id="bloc_2_texte">
					Nous sommes équipés pour une production au contact, en projection simultanée et en RTM, pour des secteurs d'activités variées comme les transports, équipements sanitaires, aménagement véhicules, mobiliers et agencements.
					<br />
					Nos clients, <span class="gras_bleu">LOHR Industrie, VEHIXEL, ACROPOSE,ESPACE 4</span>, nous font confiance dans l'élaboration de leurs petites et moyennes séries.
					<br /><br /><br />
					<img src="images/photo_societe.png" />
				</div>
			</div>
			
			<div id="copyright">Copyright© 2006 - APSAC - Tous droits réservés</div>
		</div>
			
	</div>

</body>
</html>

et la feuille de style


body {
	margin: 30px 0 0 0; 
	color: #000000; 
	font-family:  Arial,Verdana, sans-serif; 
	font-size: 10pt; 
	text-align: center;
}

img {
	margin: 0;
	border: 0;
	display: block;
}

img.texte {
	margin: 20px;
}

td {
	vertical-align: top;
}

td#bordure {
	vertical-align: top;
	border: solid 1px #DF623C;
}

ul {
	list-style-image: url(images/puce.gif);
	color: #336699;
	font-size: 12pt;
	text-decoration: underline;
}

ul#orange {
	list-style-image: url(images/puce_orange.gif);
	color: #DE613D;
	font-size: 11pt;
	text-transform: uppercase;
	text-decoration: none;
}

#global {
	position: absolute;
	width: 800px;
	left: 50%;
	margin-left: -400px;
}

#bloc1 {
	float: left;
	width: 268px;
	height: 121px;
	background-image: url(images/bloc1.jpg);
	background-repeat: no-repeat;
	text-align: left;
}

#bloc2 {
	position: absolute;
	left: 268px;
	width: 532px;
	height: 56px;
	background-image: url(images/bloc2.jpg);
	background-repeat: no-repeat;
	text-align: left;
}

#bloc3 {
	position: absolute;
	top: 56px;
	left: 268px;
	width: 532px;
	height: 139px;
	background-image: url(images/bloc3.jpg);
	background-repeat: no-repeat;
	text-align: left;
}

#bloc4 {
	position: absolute;
	top: 121px;
	left: 0;
	width: 268px;
	height: 74px;
	background-image: url(images/bloc4.jpg);
	background-repeat: no-repeat;
	text-align: left;
}

#bloc5 {
	position: absolute;
	top: 195px;
	left: 0;
	width: 198px;
	height: 405px;
	background-image: url(images/bloc5.jpg);
	background-repeat: no-repeat;
	text-align: left;
}

#bloc6 {
	position: absolute;
	top: 195px;
	left: 198px;
	width: 602px;
	height: 405px;
	background-image: url(images/bloc6.jpg);
	background-repeat: no-repeat;
	text-align: left;
}

#rubrique_accueil {
	position: absolute;
	top: 30px;
	left: 152px;
	text-align: left;
}

#rubrique_societe{
	position: absolute;
	top: 0;
	left: 47px;
	text-align: left;
}

#rubrique_pole_composites {
	position: absolute;
	top: 47px;
	left: 148px;
	text-align: left;
}

#rubrique_pole_design {
	position: absolute;
	top: 56px;
	left: 74px;
	text-align: left;
}

#rubrique_contact {
	position: absolute;
	top: 321px;
	left: 27px;
	text-align: left;
}

#photos {
	position: absolute;
	top: 120px;
	left: 50px;
	text-align: left;
}

#accueil_contact {
	position: absolute;
	top: 32px;
	left: 370px;
}

#photo_entreprise {
	position: absolute;
	top: 10px;
	left: 262px;
}

#photo_ouvrier {
	position: absolute;
	top: 10px;
	left: 430px;
}

#photo_design {
	position: absolute;
	top: 10px;
	left: 325px;
}

#titre {
	position: absolute;
	top: 60px;
	left: 40px;
}

#texte_accueil {
	position: absolute;
	top: 0;
	left: 120px;
}

#anim_accueil {
	position: absolute;
	left: 0px;
}

#frame {
	width: auto;
	height: 350px;
	overflow: auto; 
}

#bloc_1_titre {
	position: absolute;
	top: 140px;
	left: 15px;
}

#bloc_1_texte {
	position: absolute;
	top: 175px;
	left: 15px;
	padding-right: 20px;
}

#logos {
	position: absolute;
	top: 280px;
	left: 15px;
}

#bloc_2_titre {
	position: absolute;
	top: 380px;
	left: 15px;
}

#bloc_2_texte {
	position: absolute;
	top: 415px;
	left: 15px;
	padding-right: 20px;
}

#schema {
	position: absolute;
	top: 100px;
	left: 80px;
	padding-right: 20px;
}


.titre1 {
	margin-top: 5px;
	margin-left: 160px;
}

.style1 {
	margin-top: 10px;
	color: #DE613D;
	font-weight: bold;
	text-transform: uppercase;
}

.style2 {
	color: #000000;
	font-size: 9pt;
}

.style3{
	position: absolute;
	top: 0;
	left: 100px;
	padding-right: 20px;
}

.style4{
	margin-top: 20px;
	color: #DF623C;
	font-weight: bold;
	text-transform: uppercase;
	text-align: center;
}

#contenu {
	position: absolute;
	top: 25px;
	padding-left: 60px;
	color: #000000; 
	font-family: Arial, Verdana, sans-serif; 
	font-size: 11px; 
	font-weight: normal;
}

#copyright {
	position: absolute;
	top: 385px;
	left: 85px;
	color: #336699; 
	font-size: 11px; 
	font-weight: bold;
	text-decoration: underline;
}

#tableau {
	position: absolute;
	top: 100px;
	left: 20px;
}

#coordonnees1{
	position: absolute;
	top: 0;
	left: 200px;
}

#coordonnees2{
	position: absolute;
	top: 10px;
	left: 230px;
}

#plan {
	position: absolute;
	top: 50px;
	left: 0;
}

.gras_bleu {
	color: #336699;
	font-weight: bold;
}

.gras_jaune {
	color: #CC9900;
	font-weight: bold;
}

.italic_vert{
	color: #006633;
	font-size: 10pt;
	font-weight: bold;
	font-style: italic;
}

.noir {
	color: #000000;
	font-weight: bold;
	font-size: 10pt;
}

Sujet clos

CSS et mise en forme, CSS3

Problème Scrollbar sous Firefox