Bonjour à tous ;
je débute en html et css ; et en ce moment je crée une application php ; mais voilà je suis confronté à un problème que j'ai dû mal à résoudre durant qlq semaines et que çà commence à me casser la tête :
voici le code :
Code PHP :
<html>
<head>
<link rel="stylesheet" media="screen"type="text/css"
title="styleAuto" href="auto.css"/>
</head>
</html>
<body>
<html>
<head>
<title>Fonction recherche</title>
<!-- <link rel="stylesheet" media="screen"type="text/css"
title="styleAuto" href="recherch.css"/> -->
<!-- <link rel="stylesheet" media="screen"type="text/css"
title="styleAuto" href="auto.css"/> -->
</head>
<body>
</body>
</html>
</body>
</html>
<fieldset class="general"><legend>Général </legend>
<label>Client:</label>
<label class="gen"> Ronaldo <br />
</label> <label>Cabinet:</label>
<label class="gen">Michel </label><br />
<label> Dossier Complet:</label>
<input type="checkbox" name="complet" checked="true" />
<br /> <label>Type de paiement :</label>
<label class="gen">Prélèvement automatique </label> <br />
<label>Numéro client :</label>
<label class="num">2007 </label></fieldset> <body>
<fieldset class="police"> <legend>Police :</legend>
<table class="tablepolice"> <tbody>
<tr><td>Police :</td> <td class="pol">Automobile</td>
<td>Contrat soumis Révision :</td> <td colspan="5">
<input type="checkbox" name="complet" /> </td> </tr>
<tr> <td> <label> Contrat :</label></td>
<td class="valeur">PPE</td> <td>Compagnie:</td><td colspan="3"class="valeur">RISQUES PARTICULIERS</td>
<td>Paiement :</td><td class="valeur">Mensuel</td> </tr>
<tr> <td>Date création :</td>
<td class="valeur">29/01/2007 </td>
<td>Date perte :</td> <td class="valeur"> </td>
<td>Avenants :</td> <td class="valeur"> </td>
<td>Prime TTC :</td> <td class="valeur">0 </td> </tr>
<tr> <td>Numéro :</td> <td class="pol">4156879</td>
<td>Date effet:</td><td class="valeur">29/01/2007</td><td>Indice:</td>
<td class="valeur">0.0</td><td>Gestion:</td><td class="valeur"> Non Confiée</td>
</tr> <tr> <td>Etat :</td><td class="valeur">En cours</td> <td>Date écheance :</td>
<td class="valeur">01/02/2008</td> <td>Relance :</td> <td>
</td><td>Apporteur:</td> <td class="valeur"> Aucun </td> </tr>
<tr> <td>Cont:</td><td class="valeur">Aucun</td> <td>Rés./susp</td>
<td class="pol"> </td> <td>Historique:</td> <td class="valeur"></td>
<td>Commercial:</td> <td> </td> </tr> </tbody> </table> </fieldset><fieldset class="conducteur">
<legend>Conducteur</legend> <label for="bonusAncien"> Conducteur habituel:</label>
<label class="gen">Ronaldo</label><br /> <label for="bonusAncien">Né le :</label>
<label class="gen">09/06/1969 </label> <br /><label for="bonusAncien"> Numéro permis:</label>
<label class="num">020977439 </label><br />
<label for="bonusAncien"> Permis:</label> <label class="gen">B<br />
</label><label for="bonusAncien">Date Permis:</label>
<label class="gen">25/09/2006 </label> </fieldset> <fieldset class="vehicule">
<legend>Véhicule</legend> <div class="tetevehicule">
<label for="categorie">Catégorie:</label><label class="gen">
<strong>V.Particulier </strong>
</label> <br/> <label for="marque">Marque:</label>
<label class="gen">VOLKSWAGEN </label><br /> <label for="bonusAncien">Bonus Malus Ancien :</label>
<label class="gen"> </label>
<br /> <label for="bonusAncien">Bonus Malus :</label>
<label class="gen">1,00 </label><br />
<label for="bonusAncien"> Condition generales :</label>
<label class="gen"> </label><br /> <label for="bonusAncien"> Date Condition generales :</label>
<label class="gen"> </label> <br/> <label for="bonusAncien"> Mise en circulation :</label>
<label class="gen">04/09/1986 </label></div><div class="milieuvehicule">
<br /> <label for="bonusAncien"> Type de véhicule :</label>
<label class="gen">GOLF C<br /> </label> <label for="bonusAncien"> Cylindree :</label> <label class="gen">06</label><br />
<label for="bonusAncien"> Immatriculation:</label> <label id="immat">723 WL 93</label><br />
<label for="bonusAncien">Modèle:</label><label class="gen">19MH12 </label><br /> <label for="bonusAncien">Numéro de série:</label>
<label class="gen">WVWZZZ19Z6513<br /> </label>
<label for="bonusAncien"> Poids TTC :</label> <label class="gen">1T360 </label><br/>
<label for="bonusAncien"> Nombres de places :</label><label class="gen">5</label> </div>
<div class="remorque"><fieldset><legend><i>Remorque</i></legend><label>Marque:</label>
<label class="gen"></label><br /><label>Immatriculation:</label> <label class="gen"> </label><br />
<label>Valeur:</label> <label class="gen">.0000 </label><br /> <label>Année:</label> <label class="gen"> </label>
<br /> <label>PTC:</label> <label class="gen">0 </label> <br /> </fieldset> </div></fieldset> <fieldset class="utilisation">
<legend>Utilisation </legend> <label for="bonusAncien">Usage Compagnie :</label> <label class="util">DPP </label><br />
<label for="bonusAncien">Conduite exclusive :</label><input type="checkbox" name="complet" />
<label id="zone"> Zone :</label> <label class="gen"> </label><br />
<label id="autreconducteur"> Autre Conducteur :</label> <label class="util"></label><br />
<label for="bonusAncien"> Date naissance :</label><label class="util"> </label><br />
<label for="bonusAncien"> Permis :</label><label class="util"> </label><br />
<label for="bonusAncien"> numero permis :</label> <label class="numpermis">
</label><br /><label for="bonusAncien"> Date permis :</label><label class="util">
</label> <br /> </fieldset> <fieldset class="garanties"><legend>Garanties:</legend>
<div id="partie1"> <label for="bonusAncien"> RCPJ :</label><input type="checkbox" name="complet" checked />
<br /> <label for="bonusAncien">Bdg :</label><input type="checkbox" name="complet" /><br />
<label for="bonusAncien">Vol :</label><input type="checkbox" name="complet" /><br />
<label for="bonusAncien">Incendie :</label><input type="checkbox" name="complet" /><br />
<label for="bonusAncien">Tempetes :</label><input type="checkbox" name="complet" /><br />
<label for="bonusAncien">Cat.nat :</label><input type="checkbox" name="complet" checked /><br />
<label for="bonusAncien">DTA :</label><input type="checkbox" name="complet" /><br /> <label for="bonusAncien"> Access :</label>
<input type="checkbox" name="complet" /><br /> <label for="bonusAncien"> Effets :</label><input type="checkbox" name="complet" /><br />
<label for="bonusAncien"> Conducteur :</label><input type="checkbox" name="complet" checked/><br /> <label for="bonusAncien">Véh remp:</label>
<input type="checkbox" name="complet" /><br /> <label for="bonusAncien">Ind leasing:</label><input type="checkbox" name="complet" /><br />
<label for="bonusAncien">Dom.Collision:</label><input type="checkbox" name="complet" /> </div> <div id="partie2"> <fieldset class="montant">
<legend><i>Franchise et Montants</i></legend><label for="bonusAncien">Franchise Vol:</label>0 <br /><label for="bonusAncien">Franchise incendie:</label>0 <br />
<label for="bonusAncien">Franchise dommage:</label>0 <br />
<label for="bonusAncien">Franchise tempetes:</label>0 <br />
<label for="bonusAncien">Franchise effets:</label>0 <br />
<label for="bonusAncien">Franchise conducteur:</label>0 <br />
<label for="bonusAncien">Franchise accessoires:</label>0 <br />
<label for="bonusAncien">Franchise conducteur exclusif:</label><br />
<label for="bonusAncien">Franchise Catastrophe nat:</label>.0000 <br />
<label for="bonusAncien">Franchise Dom.Collision:</label>0 <br />
<label for="bonusAncien">Conducteur novice:</label><input type="checkbox" name="complet" checked />
<br /><label for="bonusAncien">Franchise Conducteur novice:</label><label class="gen">750.00 </label> <br />
<label for="bonusAncien">Montant effets:</label>0 <br /></fieldset></div><fieldset class="infos">
<legend><i>Autres Infos</i></legend><label for="bonusAncien">Date controle technique:</label><br />
<label for="bonusAncien"> Optique comprise:</label><input type="checkbox" name="complet" />
<br /></fieldset> <fieldset class="protection"><legend><i>Protections</i></legend>
<label>Gravage</label><input type="checkbox" name="complet" /><br /><label>Alarme Agréé</label><input type="checkbox" name="complet" />
<br /> <label>Type de garage:</label> <label class="gen">Voie publique</label><br /> </fieldset></fieldset><br />
la partie css :
Code PHP :
*
{
background-color: white;
}
fieldset
{
/* background-color: silver; */
background-color: white;
}
legend
{
font-weight: bold;
font-size: large;
font-style: italic;
}
/* fieldset general */
.general
{
display: block;
width: 38%;
height: 4.5cm;
}
/*les labels valeurs ds generation*/
.gen
{
color: blue;
text-align: center;
font-size: large;
}
.num
{
color: red;
font-size: large;
}
label,td
{
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: medium;
font-weight: bolder;
}
/* fieldset police */
.police
{
border-top-width: 10px;
border-top-color: red;
border-bottom-width: 10px;
border-bottom-color: red;
}
.pol
{
color: red;
text-align: center;
}
.tablepolice
{
border-right-style: solid;
border-left-style: solid;
border-bottom-style: solid;
border-top-style: solid;
border-right-width: 1px;
border-left-width: 1px;
border-bottom-width: 1px;
border-top-width: 1px;
height: 5cm;
width: 100%;
}
.tablepolice td
{
border-right-style: solid;
border-left-style: solid;
border-bottom-style: solid;
border-top-style: solid;
border-right-width: 1px;
border-left-width: 1px;
border-bottom-width: 1px;
border-top-width: 1px;
border-collapse: collapse;
}
.valeur
{
color: blue;
text-align: center;
}
/* on passe au conducteur */
.conducteur
{
display: block;
width: 30%;
position: absolute;
left: 40%;
top: 1%;
height: 4.5cm;
}
/*on passe au fieldset utilisation*/
.utilisation
{
width: 25.5%;
position: absolute;
height: 4.5cm;
top: 1%;
left: 72%;
}
/* pour la zone */
#zone
{
margin-left: 0.5cm;
}
.numpermis
{
color: red;
}
.util
{
font-size: large;
color: blue;
}
/* pour autre conducteur */
#autreconducteur
{
font-style: italic;
text-decoration: underline;
}
/* vehicule */
#immat
{
color: red;
}
.milieuvehicule
{
display: block;
position: absolute;
left: 500px;
top: 445px;
height: 5cm;
}
.remorque
{
display: block;
width: 30%;
position: absolute;
left: 69.5%;
top: 451px;
}
#partie2
{
display:block ;
position: absolute;
top: 655px;
left: 500px;
}
/* garantie fieldset*/
.garanties
{
display: block;
}
/*protection */
.protection
{
display: block;
width: 27.5%;
position: absolute;
left: 70%;
top: 660px;
}
.infos
{
display: block;
width: 27.5%;
position: absolute;
left: 70%;
top: 800px;
}
/*franchise et montant */
.montant
{
display: block;
height: 6.5cm;
left: 50%;
top: 90%;
}
/* fieldset residence - veranda -protection */
.residence
{
width: 10%;
}
si vous tester ces codes ; vous allez être confronté à un problème délicat et j'en suis sûr que c'est la partie css qui est la cause vu que je ne maitrise pas trop :
le premier problème ; les fieldset qui seront placés selon le code css
dès fois s'affiche pas dans la bonne position je veux dire au lieu d'être aligné ; s'écarte et encore pire dès fois l'affichage diffère selon le navigateur (IE ou firefox ) ; je ne sais pas trop ce qui m'a surpris c'est que j'ai testé le même code sur firefox sur mon portable ; et quand je voulais tester et installer sur un autre avec firefox çà se comporte différemment et même la police n'est plus la même
pire sur IE rien ne va plus ; les fieldset qui se met n'importe où ; avec des caractères très grand ; il faut toujours réduire le zoom
si quel'qu'un aura une solution à tout ces prblèmes ; je serai ravi :aie:
merci d'avance