Insérer une scrollbar verticale dans une zone précise

Bonjour, j'essaye actuellement d'apprendre le développement web, et j'ai décidé de coder entièrement une page en html et css.
Mais actuellement je suis bloqué au tout début car j'aimerai intégrer une scrollbar verticale seulement dans une zone précise (dans une <div>.

Vous trouverez ci-dessous mon css et mon html (je sais que j'ai surement fais des choses très barbare, mais ce n'est pas le sujet de mon post), j'aimerai intégrer la scrollbar verticale dans "centre" :

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
<!DOCTYPE html>
<html>
	<head>
		<link rel="stylesheet" href="acceuil.css">
		<title>site</title>
	</head>
 
	<body>
		<div class="hmenu">
			<p class="titre">site</p>
			<a class="co" href="lien">Se connecter</a>
		</div>
 
		<div class="vmenu">
			<a href="categorie">categorie1</a>
			<a href="categorie">categorie2</a>
			<a href="categorie">categorie3</a>
			<a href="categorie">categorie4</a>
			<a href="categorie">categorie5</a>
			<a href="categorie">categorie6</a>
			<a href="categorie">categorie7</a>
		</div>
 
		<div class="centre">
 
		</div>
	</body>
</html>

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
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
body {
	background-color: #FBEECA;
}
 
.centre {
	width: 1122px;
	height: 412px;
	position: relative;
	top: -400px;
	left: 200px;
	background-color: #F4C176;
}
 
.vmenu {
	width: 150px;
	position: relative;
	top: 12px;
	left: 20px;
}
 
.vmenu a {
	background-color: #F4C176;
	color: black;
	display: block;
	padding: 20px;
	font-family: andale mono, monospace;
	text-decoration: none;
}
 
.vmenu a:hover {
	background-color: #F9A221;
}
 
.hmenu {
	width: 1305px;
	height: 100px;
	position: relative;
	top: -15px;
	left: 20px;
	background-color: #F4C176;
}
 
.titre {
	color: black;
	text-align: left;
	letter-spacing: 4px;
	text-shadow: 3px 2px #605858;
	font-size: 250%;
 
	position: relative;
	top: 25px;
	left: 35px;
}
 
.co {
	color: black;
	text-align: right;
	font-size: 120%;
	text-decoration: none;
 
	position: relative;
	top: -15px;
	right: -1200px;
}
 
.co:hover {
	color: #FFFFFF;
}