Bonjour à tous
Je suis debutant en css et j'ai un probleme pour centrer mes élementdans mes blocs
sur IE tous fonctionne bien mais sur firefox tous est aligner a gauche au lieu être centré
voici le code CSS:
voici le code Html :
Je vous serais vraiment reconnaissant a tous ceux qui pourront m'aider à resoudre ce problème
P.S
Si il y a trop de code ou quelque chose qui n'est pas compris dite le moi
Merci d'avance pour les renseignement .
Modifié par dibla (30 May 2008 - 12:49)
Je suis debutant en css et j'ai un probleme pour centrer mes élementdans mes blocs
sur IE tous fonctionne bien mais sur firefox tous est aligner a gauche au lieu être centré
voici le code CSS:
/************************** Structure de la mise en page du site ***********/
/* bloc div conteneur contenant tous le site */
#container
{
position:relative;
text-align:center;
width:auto;
height:auto;
left:0px;
vertical-align:middle;
background-color:#bbb112;
}
/* bloc div de l'entete */
#header
{
text-align:center;
top:0px;
width:auto;
height:55px;
left:0%;
background-color:#e40e62;
}
/* bloc div contenant le le bloc page du contenue du site */
#center
{
width:auto;
height:auto;
min-height:740px;
background-color:#bbb1b1;
}
/*bloc div affichant le contenu du site pour la page logon imbriquer dans le bloc center */
#page1
{
background-color:#bbb1b1;
}
/*bloc div affichant le contenu du site imbriquer dans le bloc center */
#page
{
margin-left:200px;
background-color:#bbb1b1;
}
/* bloc div contenant les lien de navigation dans le site coté gauche imbriquer dans le bloc center */
#left
{
position:absolute;
top:55px;
width:200px;
height:auto;
left:0%;
height:600px;
background-color:#bbb1b1;
}
/* bloc div du pied de page */
#footer
{
width:auto;
height:55px;
background-color:#7e0c3d;
}
/********************* fin de la structure de mise en page *******************************/
/************************************** element dans le bloc header ****************************/
/* image gauche de l'entete*/
.imgLogo
{
float:left;
margin-left:5px;
margin-top:5px;
}
/* texte centrale de l'entete*/
.headerText
{
float:inherit;
margin-left:5px;
margin-top:5px;
}
/* image droite de l'entete*/
.imgLogoHesso
{
float:right;
margin-right:5px;
margin-top:5px;
}
/****************************fin des element dans le bloc header ******************************************/
/************************ element dans le bloc left ******************************************/
/* bloc div contenant les lien accecible par l'etudiant */
#studentDiv
{
margin-left:0px;
margin-top:80px;
left: -79px;
width: 170px;
}
/* bloc div contenant les lien accecible par l'administrateur */
#admin
{
margin-left:0px;
margin-top:22px;
left: -79px;
width: 170px;
}
/* label contenant le nom de l'utilisateur */
#lblName
{
margin-left:0%;
}
/* lien de déconnexion */
#lnkbLogout
{
margin-right:0%;
}
/************************ Fin des element dans le bloc left ******************************************/
/************************ element dans le bloc page ******************************************/
/* bloc div contenant le gridview de dévalidation des utilisateur pour la page ValidationUser.ascx */
#invalideUserDiv
{
margin-top:20px;
}
/* bloc div contenant le gridview de toute les licence acquise par un utilisateur de la page AddLicenceRentail.ascx*/
#viewLicenceDiv
{
margin-top:10px;
}
/* element contenant tous les gridview du site */
fieldset
{
width: 950px;
border-color:Blue;
font-size:x-large;
padding:10px;
}
/************************ Fin des element dans le bloc page ******************************************/
/***************************** element dans le bloc footer ****************************************/
/* bloc paragraphe gauche du pied de page */
.info
{
float:left;
margin-top:10px;
margin-left:10px;
color:Yellow;
}
#LinkInfo
{
color:Yellow;
}
#LinkInfo:hover
{
color:Green;
}
#LinkInfo:visited
{
color:Blue;
}
/* bloc paragraphe centrale du pied de page */
.droit
{
float:left;
margin-top:10px;
margin-left:100px;
color:Yellow;
}
/*********************fin element dans le bloc footer ******************************************/
voici le code Html :
<div id="container">
<div id="header">
<img class="imgLogo" src="image/LogoIngenierie.jpg" alt="image Logo HE-ARC Ingénierie"/>
<h2 class="headerText">Plateforme d'acquisition de licences MSDNAA</h2>
<img class="imgLogoHesso" src="image/LogoHesso.jpg" alt="image Logo HESSO"/>
</div>
<div id="center">
<div id="page1">
<asp [langue]anel runat="server"
ID="Panel1"
GroupingText = "Connexion" >
<h3>Veuillez svp vous logger avec votre accompte </h3>
<table style="vertical-align: middle" >
<tr>
<td>
<img src="image/attention.png" />
</td>
<td>
<h4>
Attention,veuillez svp autoriser les cookies</h4>
</td>
</tr>
<tr>
<td align="right">
<asp:Label ID="Label1" Runat="server" Font-Size="Medium">Domain:</asp:Label>
</td>
<td align="left">
<asp:TextBox ID="txtDomain" Runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td align="right">
<asp:Label ID="Label2" Runat="server" Font-Size="Medium">Username:</asp:Label>
</td>
<td align="left">
<asp:TextBox ID="txtUsername" Runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td align="right">
<asp:Label ID="Label3" Runat="server" Font-Size="Medium">Password:</asp:Label>
</td>
<td align="left">
<asp:TextBox ID="txtPassword" Runat="server" TextMode="Password"></asp:TextBox>
</td>
</tr>
<tr>
<th colspan="2">
<asp:Button ID="btnLogin" Runat="server" onclick="btnLogin_Click" Text="Login" />
</th>
</tr>
</table>
<asp:Label ID="errorLabel" Runat="server" ForeColor="#d20552"></asp:Label>
</asp [langue]anel>
</div>
</div>
<div id="footer">
<p class="info">Demande d'information : <asp:LinkButton ID="LinkInfo" runat="server" BorderStyle="None">lab-info@he-arc.ch</asp:LinkButton></p>
<p class="droit">Tous droit de reproduction et de diffusion sont interdits.</p>
</div>
</div>
Je vous serais vraiment reconnaissant a tous ceux qui pourront m'aider à resoudre ce problème
P.S
Si il y a trop de code ou quelque chose qui n'est pas compris dite le moi
Merci d'avance pour les renseignement .
Modifié par dibla (30 May 2008 - 12:49)
