Placement en float incorrect
Salut a tous,
j'ai un probleme avec firefox, je pense (voir je suis sur que c'est avec le float) mais j'ai cherché dans le forum, je n'ai pas reussi a résoudre mon probleme.
La colonne du mileu s'affiche en bas celle de gauche (uniquement sur firefox)
quelqu'un peut il m'aider???
voila mon code html :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137
|
<body>
<div id="wrap">
<div id="top"></div>
<div id="content">
<div class="header">
<h1><a href="index.html">NOM DE LA SOCIETE</a></h1>
<h2>Disponible 7/7j (slogan, accroche)</h2>
</div>
<div class="breadcrumbs">
<a href="index.html">accueil</a> · <a href="mentions.html">mentions légales </a>
</div>
<div class="left">
<div class="text">
<h2>Adresse</h2>
21, Bd du Chateau <br/>
94500 Champigny sur Marne<br/>
<a href="plan.html">Voir sur un plan</a><br/>
<a href="satellite.html"> Voir limage satellite</a><br/>
</div>
<br/>
<div class="text">
<h2>Coordonnées</h2>
Tel : 01 48 80 <br/>
Fax : 01 48 80 <br/>
Mobile : 06.22.74.17.53<br/>
<a href="contact.php">Envoyer un mail</a><br/>
<a href="contact.php">Demander devis/renseignement</a><br/>
</div>
<br/>
<div class="text">
<h2>Horaires</h2>
Du lundi au dimanche y compris les jours fériés 24h/24
<br/>
</div>
<br/>
<div class="text">
<h2>Météo</h2>
<center>
<embed width="150" height="200" wmode="transparent" type="application/x-shockwave-flash"
src="http://weather.eu.msn.com/f5/loaderSpotw18.swf?mode=spotweather&lang=FR&city=FRm_a1_c6">
</embed>
</center>
</div>
<div class="text">
<h2>Publicité</h2>
<br/>
</div>
</div>
<div class="middle">
<div class="photo">
</div>
<br />
<div class="text">
<h2>Présentation </h2>
Artisans de
père en fils, nous mettons nos compétences et
notre savoir-faire à votre service. Nous vous accueillons
dans nos ateliers : Paris 11ème, Paris 19ème,
Verrière le Buisson (91370), le Valois Perret (92300), et
Nogent sur Marne (94130). Nous vous garantissons un travail
soigné et de qualité. N'hésitez pas
à nous contacter.
</div>
<br />
<div class="activite">
<h2>Activités</h2>
<ul>
<li>dépannage de serrurerie </li>
<li>plomberie </li>
<li>travaux d'assainissement </li>
<li>dépannages urgents à domicile </li>
<li>pose de vitrerie </li>
<li>vidange, curage </li>
</ul>
</div>
<br/>
<div class="text">
<h2>Produits et services</h2>
Assainissement : <br />
<ul>
<li>Graisse </li>
<li>Eaux usées </li>
<li>Tout déchet </li>
<li>Vidange/nettoyage bacs à graisse </li>
</ul>
</div>
<div class="text">
<h2>Agrément et label</h2>
<ul>
<li>Agrément </li>
<li>Label </li>
</ul>
</div>
<div class="text">
<h2>Moyens de paiement</h2>
<ul>
<li>Chèques bancaires </li>
<li>Carte Bleue </li>
</ul>
</div>
</div>
<div id="clear"></div>
</div>
<div id="bottom"></div>
</div>
</body>
</html> |
et mon code CSS
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126
| * {
padding: 0;
margin: 0;
}
body {
background: #fff;
font: .74em "Trebuchet MS" Verdana, Arial, sans-serif;
line-height: 1.5em;
}
a {
color: #3B6EBF;
text-decoration: none;
}
a:hover {
color: #083479;
}
#wrap {
margin: 20px auto;
width: 724px;
background: #fff url('images/midbg.jpg');
background-repeat: repeat-y;
}
#top {
background: #fff url('images/topbg.jpg');
height: 30px;
}
#content {
padding: 0 40px 0 40px;
}
#bottom {
background: #fff url('images/botbg.jpg');
height: 30px;
}
.header {
height: 100px;
background: #85ACF7 url('images/hidr.jpg');
}
.header h1 { padding-left: 17px; padding-top: 22px; font-size: 22px; color: #FFF; }
.header h1 a { font-size: 40px; color: #FFF; text-decoration: none;}
.header h2 { padding-left: 17px; padding-top: 10px; font-size: 17px; color: #FFF; }
.breadcrumbs {
background: #d2e3ef;
border-bottom: 1px solid #E1E1E1;
font-weight: bold;
font-variant: small-caps;
padding: 5px;
}
.middle {
float: left;
width: 59%;
margin: 0 30px;
padding: 2% 1%;
text-align: justify;
}
.middle ul {
padding: 0px 0 15px 20px;
margin:0;
}
.photo {
background: #d2e3ef;
text-align : center;
}
.text {
background: #d2e3ef;
font-weight: bold;
padding: 0px 0px 8px 10px;
}
.activite {
background: #d2e3ef;
font-weight: bold;
}
.left {
float: left;
width: 35%;
margin: 0 0px;
padding: 0% 0%;
}
.left ul {
padding: 20px 0 15px 20px;
margin:0;
}
.left li {
margin-bottom:5px;
list-style-type: square;
color: #3B6EBF;
}
.middle h2 { color: #3B6EBF; font-size: 16px; margin-bottom: 10px; margin-top: 10px;}
.left h2 { color: #3B6EBF; font-size: 14px; margin-top: 15px;}
#clear {
display: block;
clear: both;
width: 100%;
height:1px;
overflow:hidden;
}
#footer {
text-align: center;
color: #666;
} |