28173 sujets

CSS et mise en forme, CSS3

Bonsoir tout monde,
Voila sur mon site je possede une chat box et je voudrais mettre un scrollbar pour ne pas quelle garde une taille fixe.. La ca va ce n'est pas tres dur mais voila je me heurte a un probleme maintenant.. La taille du scrollbar. plutot que de longues explications, je vous propose d'aller voir a cette adresse : http://underground-psp.ifrance.com Comme vous pouvez le voir, le scroll est present mais le texte defile sur le logo ect .. Je voudrai que le texte ( les commentaires ) passe en dessous le formulaire d'envois et le logo.

Je vous met mon code CSS pour que ce soit plus clair

Le code PHP ( sert pas a grand chose mais sait t'on jamais:)):

<div class="Element_Menu">
	<div class="element_chatbox">
	
	
	<?php include ("Chat_box.php"); ?>
	</div>
	</div>


Et le code CSS pour finir que j'ai utiliser :


.Element_Menu
{
	float: left;
	color: white;
	background-color: #002DB8;
	background-image: url("images/Haut_Menu.png");
	background-repeat: repeat-x;
	border: 2px outset;
	margin-bottom: 10px;
	width: 160px;
}

.element_chatbox
{
	
	width: 160px;
	height: 350px;
	overflow: auto;
	background-image: url("images/chatBoxB.png");
	padding-top: 50px;
	background-repeat: no-repeat;
}


Voila merci de vos réponse et de votre temps !! Smiley smile
Salut,

Si j'ai bien compris ton problème...

je pense que le mieux serait que tu utilise le logo "chat" en dur dans le code html, avec la balise img et le alt="" bien renseigné. Tu dispose ensuite ton "element_chatbox" juste en dessous, et l'overflow n'empiètera pas sur le logo.
De plus mettre ce logo dans la page avec l'attribut alt sera bien plus accessible pour la compréhension de cette zone.
Modifié par Mikachu (15 Nov 2006 - 17:43)
Modérateur
bonsoir,
en fait il faudrait que tu mette tes <p> dans un div , que tu le dimensionne et quel tu lui applique le overflow:auto;
de cette façon le formulaire ne bouge plus et rien ne remonte sur le logo en fond.

++

<edit> et en usant d'une liste , tu dimensionne le conteneur:
ex:

<ul>
<li><strong>joemoi</strong>: blabla</li>
<li><strong>joke</strong>: blabla</li>
<li><strong>joemoi</strong>: blabla</li>
<ul>

et par exemple :

ul {height:200px;overflow:auto;list-style-type:none;}

Modifié par gcyrillus (15 Nov 2006 - 17:51)