28172 sujets

CSS et mise en forme, CSS3

PB paragraphe et interligne.

Tout d'abord bonjour à tous!
voilà, débutant, j'ai déjà consulté ici un sujet concernant mon problème mais hélas, cela ne résout pas le mien.
Voici mon problème : Concernant l'élément <p>.

}
#content div.section p{
padding:0 0 10px 0;
margin:0 0 0 0;
font:normal 11px/23px Verdana, Arial, Helvetica, sans-serif;
color:#797979;
background-color:inherit;
}

Quelqu'un peut il éclairer ma chandelle?
Merci d'avance
Franck
Merci Florian ma question est que je veux mettre des paragraphe dabns mes textes mais l'interligne ne laisse plus assez d'espace pour ça....
Je rajoute pour infos :

/*--------------------General---------------------------*/
body{
background:url(../images/main_bg.jpg) repeat 0 0;
padding:0 0 0 0;
margin:0 0 0 0;
color:#000000;
background-color:inherit;
}
p, h1, h2, h3, h4, h5, h6, form, input, label{
padding:0;
margin:0;
}
a{
outline:none;
text-decoration:none;
}
.spacer{
clear:both;
line-height:0;
font-size:0;
}
img{
border:none;
padding:0;
margin:0;
}

/*--------------------General---------------------------*/

Voilà ce que j'ai en haut de ma feuille.
Merci
Franck
Bonsoir,

octopus49 a écrit :
je veux mettre des paragraphe dabns mes textes mais l'interligne ne laisse plus assez d'espace pour ça....

Désolé, je n'ai strictement rien compris.

Le rendu que tu montres (capture) semble correct. Est-ce le rendu actuel ou ce que tu souhaites obtenir? Si c'est le rendu actuel, comment veux-tu le changer? Et quel est le code HTML?
Je ne suis pas sur de te suivre. Ton problème est que ton texte est plus long que l'image? Qu'entends tu par "je veux mettre des paragraphe dans mes textes"?
Envoie ton html, ça aidera.
Déjà merci de voir mon problème.
En effet, vu mon jpg, rendu que j'ai obtenu, je voulais rapetisser les interlignes de façon à ce que les mots en gras soient les uns sous les autres (puces alignées), là tout est à la suite.
Je pense qu'en réduisant l'interligne, je gagne de la place.
Qu'en pensez vous.
Voici le html :


<!--HOME PAGE STARTS -->
<div class="section">
<h2>BIENVENUE</h2>
<img src="images/Welcome_img.jpg" alt="" />
<p><strong>DOCK DES EVENEMENTS</strong>: Agence de communication par l’évènement.</p>
<p>• <strong>Écouter</strong> votre demande et devenir un véritable partenaire de votre événement.
• <strong>Apporter des réponses et définir</strong> les solutions grâce à notre savoir-faire et la maîtrise que nous avons des techniques et de leurs contraintes.
• <strong>Développer et réaliser</strong> vos idées.
• <strong>Concevoir</strong> tout ou partie de votre évènement en collaboration avec vos services ou votre agence de communication.
• <strong>Intégrer,gérer et coordonner</strong> techniques et prestataires pour un résultat cohérent.</p>
</div>
<!--HOME PAGE ENDS -->

Merci à vous.
Franck
Premièrement, j'aurais utilisé une liste au lieu d'un paragraphe pour la liste de compétences.
<!--HOME PAGE STARTS -->
<div class="section">
	<h2>BIENVENUE</h2>
	<img src="images/Welcome_img.jpg" alt="" />
	<p><strong>DOCK DES EVENEMENTS</strong>: Agence de communication par l’évènement.</p>
	<ul>
		<li><strong>Écouter</strong> votre demande et devenir un véritable partenaire de votre événement.</li>
		<li><strong>Apporter des réponses et définir</strong> les solutions grâce à notre savoir-faire et la maîtrise que nous avons des techniques et de leurs contraintes.</li>
		<li><strong>Développer et réaliser</strong> vos idées.</li>
		<li><strong>Concevoir</strong> tout ou partie de votre évènement en collaboration avec vos services ou votre agence de communication.</li>
		<li><strong>Intégrer,gérer et coordonner</strong> techniques et prestataires pour un résultat cohérent.</li>
	</ul>
</div>
<!--HOME PAGE ENDS -->


Ensuite, concernant le fait que ça dépasse de l'image, peu de solutions :

-Raccourcir le texte
-Reduire la typo ou l'interligne
-Mettre une image plus grande

Sachant que dans tous les cas, l'utilisateur pourra modifier la taille du texte.
Merci Florian, mais comme tu dis :
"Ensuite, concernant le fait que ça dépasse de l'image, peu de solutions :

-Raccourcir le texte
-Reduire la typo ou l'interligne
-Mettre une image plus grande

Sachant que dans tous les cas, l'utilisateur pourra modifier la taille du texte."

Le problème est donc que je voudrais changer l'interligne dans le CSS mais où?
Peux tu m'éclairer?

ET ensuite j'essaie ta liste.
Merci
Franck
Dans ta css : 
font:normal 11px/23px Verdana, Arial, Helvetica, sans-serif;

Le 11px correspond à ta taille de police. Le deuxième au line-height.
YES! je n'en avais pas la preuve...super...j'essaie de suite.
Au fait j'ai essayé ta liste elle ressort correctement alignée mais alors plus assez de place et de plus la couleur est par défaut j'imagine et police trop grande.
Je retente avec tes conseils
Je pense que ça va aboutir.
Merci
franck
Voilà Florian,
qu'en penses tu? en tous cas c'est ce que je voulais!
upload/32646-Capturer.JPG
Par contre je n'ai pas mis ta liste car je n'arrive pas à retrouver style de texte mais que mise en forme.
Merci
Franck
J'en pense que tu as posté deux fois la même image... Smiley sweatdrop

Edit : OK tu l'as vu.

octopus49 a écrit :
Par contre je n'ai pas mis ta liste car je n'arrive pas à retrouver style de texte mais que mise en forme.


Sur quoi tu bloques? Tu dois styler les ul et les li...
Modifié par Florian_R (16 Sep 2010 - 20:15)
Il s'agit effectivement d'une liste, donc utiliser un UL et des LI comme le suggère Florian_R est tout à fait pertinent.
Bien sûr, il faut adapter les styles CSS pour ce code HTML. Mais c'est à la porté de n'importe quelle personne qui débute en CSS, à condition de se documenter un minimum et d'y passer un peu de temps. Smiley cligne
Merci Florent...mais je me documente quand même car avant de vous soumettre mon PB...j'ai fait pas mal de recherches et là d'un coup la solution, grandeur de police et interligne dans la m^me écriture.
Ceci dit...je vais continuer à me documenter pour mettre en place votre liste....
Je vais ramer mais y arriver : c'est en forgeant qu'on devient forgeron!
Merci et si je rame trop je reviens ok?
Merci
Sujet clos
Aller à