Discussion :

[bontempf]

Bonjour,

Mon site est actuellement en PHP et j'aimerais le reprendre à zéro pour le mettre en CSS.
J'ai parcouru les cours diponibles sur le CSS, mais je ne sais pas par ou commencer:
www.ecologeii.dafun.com

J'utilise actuellement des tableaux, et j'aimerais avoir la même disposition mais en CSS.

Sur mon site actuel, j'ai une bordure noire qui contourne l'ensemble du site. Comment puis-je réaliser ceci en CSS?

Comment est il possible de mettre un espace fixe entre deux menux.
J'ai réaliser plusieurs menu en CSS et je les appels avec div


Merci beaucoup,
Florian

[trotters213]

et bienvenu,
voici un petit tuto pour débuter avec le CSS et la disposition : http://pbnaigeon.developpez.com/tuto...e-en-page-CSS/

[bontempf]

Oui merci, c'est de ce tutorial que je m'inspire.

Mais mon souci, c'est comment faire un cadre autour du site (un contour qui encadre le bandeau, le pied de page, le menu, le contenu etc...(un seul contour)?


Merci d'avoir répondu

[reg64]

salut,
je me sui inspérer aussi de ce tuto et j ai fais exactement la meme chose que toi(En fin si j ai bien conpris ton problème...)
code 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
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
 
 
div {
 
	position:relative;
	text-align:center;
 
	}
div#cadre{
	width:915px;
	height:auto;
	border-style:solid; 
	border-width:3px; 
	border-color:black;
	margin-left:auto;
	margin-right:auto;
 
}
 
div#bandeau {
	margin-left:0px;
 
	border-style:solid; 
	border-width:1px; 
	border-color:black;
	width:750px;
	background-color:#eeeeee;
	}
div#menu {
	border-style:solid; 
	border-width:1px; 
	border-color:black;	
	float:left;
	width:140px;
	height:auto;
 
	background-color:#bbbbbb;
	}
div#contenu {
 
	float:left;
	width:600px;
	background-color:#cccccc;
 
	}
 
div#image {
 
	border-style:solid; 
	border-width:1px; 
	border-color:black;
	float:left;
	width:165px;
	height:auto;
	background-color:#bbbbbb;
 
	}
 
div#pied_page {
	clear:both;
	width:850px;
 
	}

puis:
<div id="cadre">
....tes autres div
</div>
ben je balance ca ou cas ou....

[trotters213]

À noter que tu peux largement diminuer la taille de sa feuille de style :

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
div {	
position:relative;
text-align:center;	
}
 
#cadre{
width:915px;
border:solid 3px #000;
margin:0 auto;
}
 
#bandeau {
margin-left:0px;	
border:solid 3px #000;
width:750px;
background-color:#eee;
}
 
#menu {
border:solid 3px #000;
float:left;
width:140px;
background-color:#bbb;
}
 
#contenu {
float:left;
width:600px;
background-color:#ccc;
}
 
#image {
border:solid 3px #000;
float:left;
width:165px;
background-color:#bbb;
}
 
#pied_page {
clear:both;
width:850px;
}

PS : ceci

Code :

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

1
2
3
4
div {	
position:relative;
text-align:center;	
}

te sert à quoi ?

[reg64]

salut,
position: relative, sert a positionner mes div, si je met absolute a la place mes div se mettent les un sur les autres, et align-texte:center sert a aligner le contenu des divs (centre).
corrigez moi si je me trompe.

ps: je suis debutant