Problème de div et css

Version imprimable

11/10/2006, 21h11
fredhali2000

Problème de div et css

Jour'

J'ai une page html et une css associée
Je voudrais trois sortes de div (gauche, milieu et droite) qui puissent cohabier cote à cote.
Comment faire ?
11/10/2006, 21h26
Linaa

T'as un bout de code à nous montrer?
Tu testes et ensuite tu poses ton problème...

La 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
#titre
{
color : darkred;
background-color : green;
font-size : 300%;
font-weight : bold;
text-align : center;
margin : 10px 300px;
padding : 30px;
}
#gauche
{
color : blue;
background-color : red;
text-align : center;
font-weight : bold;
position : relative;
left : 2.5%;
width : 30%;
margin-top : 20px;
}
#milieu
{
color : red;
background-color : blue;
text-align : center;
font-weight : bold;
position : relative;
left : 35%;
width : 30%;
}
#droite
{
color : orange;
background-color : green;
text-align : center;
font-weight : bold;
position : relative;
left : 67.5%;
width : 30%;
}

La page HTML :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<!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">
    <link rel="stylesheet" type="text/css" href= "fredhali2000.css">
    <title>
    </title>
  </head>
  <body>
    <div id="titre">      Bienvenue sur le site de Fredhali2000
    </div>
    <div id="gauche">      PHOTOGRAPHIE
    </div>
    <div id="milieu">      INFORMATIQUE
    </div>
    <div id="droite">      EQUITATION
    </div>
  </body>
</html>

11/10/2006, 22h08
fredhali2000

Le probleme est que j'aimerais que les trois div soient alignés horizontalement...
11/10/2006, 23h03
Bisûnûrs

Cherche du côté de la propriété CSS float:left.
12/10/2006, 09h29
fredhali2000

Merci, mais cela ne fait pas ce que je veux...
Dois-je utiliser un tableau, ou puis-vraiment le faire en CSS ?
Float : left marche pour le premier, mais pas les suivants...
12/10/2006, 10h11
Bisûnûrs
Ben écoute, regarde ce qu'on peut faire avec les <div style="float:left">, cette page a été faite sans aucun tableau :
http://img145.imageshack.us/img145/3478/gniana0.th.jpg

Trois div alignés :
Code:

1 2 3 <div id="gauche">Bla</div> <div id="centre">Bli</div> <div id="droite">Blu</div>
Code:

1 2 3 4 5 6 7 8 9 10 11 12 #gauche{ float:left; width:100px; } #centre{ float:left; width:300px; } #droite{ float:left; width:100px; }
12/10/2006, 10h36
fredhali2000

Merci.