Positionnement de block en CSS

**akrogames** · 02/03/2008, 18h29

Bonjour à tous,

Alors je vais vous expliquer mon problème qui est mineur. Et j'aurais deux questions à vous poser.

Alors ma première question:

Voici mon XHTML:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
 
 
 
 
 
   <head>
 
 
 
       <title>AkrogAmes Boutique en ligne de produits Hight Tech</title>
 
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 
       <link rel="stylesheet" media="screen" type="text/css" title="style" href="design.css" />
 
 
 
   </head>
 
 
 
 
 
   <body>
 
 
 
        <div id="header">
        <img src="images/index_01.gif" border="0">
        </div>
 
        <div id="header-centre">
        <img src="images/index_02.gif" border="0">
        </div>
 
        <div id="header-panier">
        <img src="images/index_03.gif" border="0">
        </div>
 
 
</body>
</html>

Mon CSS:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
body
{
        margin: auto;
        width: 1000px;
}
 
div#header
{
        margin-top: 10px;
}
 
div#header-centre
{
        margin-top: 10px;
        margin-left: 407px;
}
 
div#header-panier
{
        margin-top: 10px;
        margin-left: 600px;
}

voici ce que cela donne:
Screenshoot

Vous voyez le problème je voudrais que cela se touche moi... et que cela reste centré automatiquement surtout.

ma deuxième question est que je voudrais que mon corps de page qui n'est pas fait actuellement puisse s'agrandir en hauteur suivant la taille du texte automatiquement (c'est cela le fait par défaut) mais le problème je voudrais que mon pied de page suive. Enfin je pense que je suis pas le premier à avoir cesproblèmes.

j'espère que vous pourrez m'aider.

Thibaud

EDIT:

**Erwan31** · 02/03/2008, 18h59

Bonsoir,
je crois que si tu souhaites faire d'autre pages web dans le futur, va falloir te former un peu

Tu es atteint d'une maladie fréquente, la divite aigue

(sur utilisation des div)
Tu n'as pas besoin d'imbriquer tes image dans des div si c'est le seul élément de ton div. L'essentiel est de ne pas avoir tes images directement dans le body...

Donc ce qui donne pour le HTML:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
<div id="banner">
<img src="images/index_01.gif" alt="Acrogames.com - Ventes de produits hight teck" height="" width="" />
<img src="images/index_02.gif" alt="" height="" width="" />
<img src="images/index_03.gif" alt="Mon panier" height="" width="" />
<div>

Sachant qu'il vaut mieux n'avoir qu'une seule image de le taille du logo
avec un background CSS et éviter ces découpage d'un autre temps

Ne pas oublier l'attribut alt et les attributs de taille.

CSS

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
#container {
        margin: 0 auto;
        width: 1000px;
}
#banner img  {float:left; /*éviter les espaces horizontaux a droite des images*/}
...

Tu ne dois pas placer les marge auto et la largeur sur le body mais un div conteneur global (#container par exemple)

**akrogames** · 02/03/2008, 19h09

Bonjour mon ami,

Arf j'utilise trop de div

Disons que j'essaye de ne plus utiliser les tableau pour le design et que j'ai de vieille habitude qui revienne.

Bon je vais essayer tes idées je n'avait pas le même concept que toi en fait.

Je vais regarder merci mon ami.

Thibaud

Positionnement de block en CSS

Positionnement en CSS

Vue hybride

Discussions similaires

Partager

Partager