Centrer verticalement un text

[F]ull-sky Messages postés 175 Date d'inscription Statut Membre Dernière intervention -
Utilisateur anonyme - 11 janv. 2015 à 15:05

Bonjour,

J'ai un soucie en html/css, je sollicite votre aide car malgré les recherches google et se que j'ai trouver sur la toile, rien ne fonctionne. Je pense que l'erreur vient surement de mon code.

Je voudrais centrer verticalement un text dans une div mais rien ne fonctionne.

Vous comprendrez mieux avec cette capture :

Effectivement je souhaite remonter le text afin qu'il soit centrer en hauteur, par rapport à l'image de gauche.

Voici le code html:

<div id="contenuAssiettes">
<p><img src="assiettes/assiette1.png" class="effet_assiette" />
    <b>Pattes carbonara</b> : Spécialité du chef, apprécié par les clients.</p>
    </div>

Voici le code CSS:

#contenuAssiettes{
    border-left: 10px solid #8a6f87;
    margin: auto;
    height: 175px;
    width:780px;
    background-color: rgba(255, 255, 255, 0.03);
}


#contenuAssiettes > p{
    margin-bottom: 100px;
    display: inline;
    color: white;
    vertical-align:middle;
     font-family: "demo", sans-serif;


}

Merci de votre aide.

Afficher la suite

A voir également:

Html centrer verticalement
Editeur html - Télécharger - HTML
Espace en html ✓ - Forum HTML
Espace html ✓ - Forum Webmastering
Html download - Télécharger - HTML
Écran tv coupé en deux verticalement ✓ - Forum Ecran

1 réponse

Réponse 1 / 1

Utilisateur anonyme

Bonjour

https://www.alsacreations.com/tuto/lire/1032-comment-centrer-verticalement-sur-tous-les-navigateurs.html

Pas du chercher au bon endroit ^^

[F]ull-sky Messages postés 175 Date d'inscription Statut Membre Dernière intervention 23

Navré mais je suis bien allez voir sur Alsa création mais je n'avais pas réussie à le faire fonctionner.
C'est pourquoi je me tourne vers cette communauté.

Je sais que ce 'est pas compliquer mais cela ne fonctionne pas.

Utilisateur anonyme

Centrer verticalement un bloc dans un conteneur de hauteur fixe :

Html

<div class="conteneur">
  <div class="bloc">
    <h3>Kikoo !</h3>
    <p>Lorem ipsum [...]</p>
  </div> 
  <span></span>
</div>

CSS

div.conteneur {
  height:200px;
  line-height:200px;
  text-align:center; /* centrage horizontal */
}

div.bloc {
  width:100px;
  border:1px solid #fff;
  vertical-align:middle;
  display:inline-block;
  line-height:normal; /* on rétablit le line-height */
  text-align:left; /* ... et l'alignement du texte */
}

Source : https://www.alsacreations.com/tuto/lire/1032-comment-centrer-verticalement-sur-tous-les-navigateurs.html

Ps -> jamais je ne te donnerai une réponse toute faite ...

Cdt

[F]ull-sky Messages postés 175 Date d'inscription Statut Membre Dernière intervention 23

J'ai suivie cette partie du tutoriel également, mais elle sert a centrer deux éléments l'un en dessous de l'autre si j'ai bien compris. Tandis que moi je souhaiterais les centrer à côté.
Sachant que je ne connais pas très bien le code, je ne sais pas quelle propriété modifier.

Utilisateur anonyme > [F]ull-sky Messages postés 175 Date d'inscription Statut Membre Dernière intervention

[F]ull-sky Messages postés 175 Date d'inscription Statut Membre Dernière intervention 23

...? Saurait-tu quelle balise doit être changer ?

Discussions similaires

Votre réponse

Discussions similaires