alignement au centre

Marsh Posté le 08-04-2005 à 10:23:32

Bonjour

Je viens de terminer un site en HTML/CSS. Le site est structuré avec des balises DIV couplé avec CSS.
Petit problème, le site est aligné sur la gauche car mes blocs ont des attributs de types float:left;

Code :

#navBar
{
float: left;
width: 200px;
padding: 0px;
background-color: #D3FFCE;
}
#contenue
{
float: left;
width: 744px;
background-color: #FFFCEC;
text-align:center;
border-left: 1px solid #cccccc;
border-right: 1px solid #cccccc;
padding: 20px 10px 10px 10px;
min-height:280px;
}

Je souhaiterai aligner la totalité du site au centre de la page, j'ai déjà essayé de l'encadrer par des balise s DIV et de le centrer mais ca ne marche pas !

Merci de vos réponses

Reply

Marsh Posté le 08-04-2005 à 10:23:32

Reply

Marsh Posté le 08-04-2005 à 10:48:50

Bah si ils sont en float left, tu va pas pouvoir les centrer, ça s'appelle de la logique [:joce]

Reply

Marsh Posté le 08-04-2005 à 11:01:38

je pense bien... mais pour float il existe pas middle ou center, donc comment faire. Et si je vire les float:left, mon site ne resemble plus a rien.

Reply

Marsh Posté le 08-04-2005 à 11:02:06

Oula :heink: T'aura pas ton site en ligne histoire de voir ?

Reply

Marsh Posté le 08-04-2005 à 15:49:53

splite2003 a écrit :

Bonjour

Je viens de terminer un site en HTML/CSS. Le site est structuré avec des balises DIV couplé avec CSS.
Petit problème, le site est aligné sur la gauche car mes blocs ont des attributs de types float:left;

Code :

#navBar
{
float: left;
width: 200px;
padding: 0px;
background-color: #D3FFCE;
}
#contenue
{
float: left;
width: 744px;
background-color: #FFFCEC;
text-align:center;
border-left: 1px solid #cccccc;
border-right: 1px solid #cccccc;
padding: 20px 10px 10px 10px;
min-height:280px;
}

Je souhaiterai aligner la totalité du site au centre de la page, j'ai déjà essayé de l'encadrer par des balise s DIV et de le centrer mais ca ne marche pas !

Merci de vos réponses

Salut :hello:

Comme il n'y avait pas de lien vers le site, j'ai testé le code suivant :

Code :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title>
</title>
<style type="text/css">
<!--
#navBar {
float: left;
width: 200px; /*** à remplacer par width: 20%; ***/
padding: 0px;
background-color: #D3FFCE;
}
#contenu {
float: left;
width: 744px; /*** à remplacer par width: 80%; ***/
background-color: #FFFCEC;
text-align: center;
border-left: 1px solid #cccccc;
border-right: 1px solid #cccccc;
padding: 20px 10px 10px 10px;
min-height: 280px;
}
-->
</style>
</head>
<body>
<div id="navbar">navbar</div>
<div id="contenu">contenu</div>
</body>
</html>

Sous IE 5.5 et Firefox 1.0.2, les 2 blocs ne sont pas alignés à gauche quand je suis en résolution 1024x768.

Mais en 800x600 ils sont l'un en dessous de l'autre et alignés à gauche.

Mais cela est normal vu la largeur des blocs (200px + 744px = 944px) donc comme il n'y a pas assez de place en largeur le 2eme se place en dessous.

Je ne sais pas exactement ce que tu veux faire mais si tu mets des valeurs proportionnelles à des "width" tes blocs seront alignés l'un à coté de l'autre quelque soit la résolution d'écran

Essayes en remplacant les valeurs en pixels des "width" par des valeur en % voir valeurs à remplacer dans le code ci-dessus.

[:fafane84]

Message édité par fafane84 le 08-04-2005 à 16:00:39

---------------
Mon Topic de Vente Hardware

Reply

alignement au centre

Sujets relatifs:

Leave a Replay