overflow uniquement vertical

div et retour à la ligne

Bonjour à tous.

Je cherche un moyen de mettre un overflow, avec une scrollbar main uniquement en vertical. Il faudrait que le retour à la ligne se fasse automatiquement. Si quelqu'un connait un attribut ou autre, voire un truc en PHP, soyons fous... :king:

en php c'est pas possible car il n'agit pas sur le code html
il te faut donc utiliser le côté css de la chose :P
essaye un truc du genre

Code:

.monBloc {overflow-y:auto;}

je vois pas de différence. Pas sous FF3 ou Opera 9 en tout cas...

:(
Code:

1 2 3 4 5 6 7 8 div#contenu { float:left; left:20px; width:750px; height:650px; overflow : auto; }
(pour info)

edit : Si vous trouvez pas, au pire je viens de me rendre compte qu'Opera le prend correctement, donc je pense qu'il n'y a pas possibilité. firefox me colle un scrollbar et IE... ben le site est pas opti pour IE pour l'instant donc bon...

http://www.brunildo.org/test/Overflowxy2.html
très pratique !

Bon, merci du tuyau, apres test ça me donne :

Sous IE7 : c'est ok. Même si le reste de ma CSS est pas opti (je jetterai un oeil pour des tutos la dessus) :

http://nsa06.casimages.com/img/2009/...2317919521.png

Sous firefox : C'est pas ok : J'ai pas de retour à la ligne quand il arrive à la limite de mon div :
http://nsa06.casimages.com/img/2009/...2446527485.png
(même si il prend pas trop mal la le reste de la CSS.)

Je vous met la CSS en entier (stylesheet.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
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
69
70
71
72
73
74
75
76
77
78
body
{
	background: url("images/background.jpg") repeat-x;
	text-align:center;
	font-family:verdana, sans-serif;
	margin-top:20px;
	margin-bottom:20px;
	white-space:pre;
}
 
a:link{text-decoration:underline;color:#000;}
a:visited{text-decoration:underline;color:#000;}
a:hover{text-decoration:underline;color:#000;}
 
 
div#page 
{
	background-color:#fff;
	width:990px;
	height : 1000px;
	margin:auto;
	border:1px #000 solid;
}
 
div#bandeau {
	width:990px;
	height:320px;
	}
div#menu {
	float:left;
	width:245px;
	height:650px;
	}
div#sous-menu
{
	width : 245px;
	height : 150px;
	background-image:url("images/background_menu.jpg");
}
 
div#sous-menu ul
{
	margin-left:40px;
	font-size:12px;
	font-weight:bold;
	list-style-type:none;
	text-align:left;
}
 
 
div#sous-menu h3
{
	text-align:center;
	font-weight:normal;
	font-size:22px;
}
div#contenu 
{
	float:left;
	left:20px;
	width:745px;
	height:650px;
	overflow-y: auto;
	overflow-x: visible;
}
 
div#contenu #lettrine
{
	float:right;
	margin-right : 5px;
}
 
div#pied_page {
	clear:both;
	width:990px;
	height:30px;
	background-image:url("images/barre_bas.jpg");
	}

Et voici ma page d'index (le reste des pages n'est qu'un include sur l'index.) : index.php

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
<html>
<head>
	<meta http-equiv='Content-Type' content='text/html; charset=iso-8859-1'>
	<link rel='stylesheet' type='text/css' href='stylesheet.css'>
	<title>Perignat-lès-Sarliève : Si t'es jeune</title>
</head>
<body>
 
<div id='page'><div id='bandeau'><embed width='990' height='320' src='flash/home.swf' /></div>
	<div id='menu'>
		<div id='sous-menu'>
		<h3>Découvrir</h3>
		<ul>
			<li><a href='index.php'>Présentation</a></li>
			<li><a href='index.php?page=organigramme'>Organigramme</a></li>
			<li><a href='index.php?page=but'>But/Objectifs</a></li>
			<li><a href='index.php?page=fonctionnement'>Fonctionnement</a></li>
		</ul>
		</div>
		<div id='sous-menu'>
		<h3>S'informer</h3>
		<ul>
			<li><a href='index.php?page=calendrier'>Programme des activités</a></li>
			<li><a href='index.php?page=projets'>Les projets</a></li>
			<li><a href='index.php?page=reunions'>Réunions</a></li>
		</ul>
		</div>
		<div id='sous-menu'>
		<h3>Contacter</h3>
		<ul>
		<li><a href='index.php?page=contact_stj'>Si T'es Jeune</a></li>
		<li><a href='index.php?page=contact_mairie'>Mairie de Pérignat</a></li>
		<li><a href='index.php?page=forum'>Forum/Tchat</a></li>
		</ul>
		</div>
	</div>
	<div id='contenu'>
	<!--contenu : inclusion d'une page -->
	</div>
	<div id='pied_page'>
		Association Si T'es Jeune (c) 2007 - Tous droits réservés.
	</div>
</div>
</body>
</html>

(J'ai réduit à ce qui nous interessait)

Pour ceux qui veulent voir le résultat en vrai : http://sitesjeune.fr.nf

(avec un zoli lorem ipsum pour qu'on voie bien le problème)

Voila, j'espère que j'ai explicité mon problème...

Bon, en fait j'ai repris ma CSS de zéro avec un pote, c'est réglé. Merci quand même pour l'aide.