28111 sujets

CSS et mise en forme, CSS3

Positionner du texte a droite d'une image en forme de "bloc"

Bonsoir, je n'arrive pas a placer du texte a droite de mon image de façon souhaité.

En haut c'est le résultat que j'ai tout le temps et en bas c'est le résultat que je souhaiterais (désolé si c'est assez explicite)

upload/1572028668-77403-capture.png

Je voudrais que le texte soit a droite de mon image, en forme de bloc, qu'il soit en sorte compact

ty ^^"
Modifié par Efeelios (25 Oct 2019 - 20:37)
Le résultat n'est pas celui voulu. Le texte sort de ma page, et il n'est pas en bloc comme je l'ai demandé ^^
Je veux qu'il soit en quelque sorte entouré de qlq chose d'invisible qui empêcherai de lui prendre une forme random, je peux pas être plus précis que dire vouloir lui donner une forme de bloc.

Voilà le seul bout de code que j'ai pu utiliser :

                <p class="textedroite">
                    Test ceci est un teste teste teste teste teste testes te
                </p>


et mon css

.textedroite{
    color: #555;
    float: right;
}
j'ai corrigé, ty.

J'ai suivi le cours d'Alsa sur gérer les débordements et mon bloc est formé. Mais je n'arrive pas a le déplacer dans ma page.

Voilà le code :

.textedroite{
    color: #555;
    overflow: hidden;
    max-width: 500px;
    overflow-wrap: break-word;
    line-height: 1.7em;
    text-align: right;

}


et pour mon image:
.unpeu{
    float: left;
    position: relative;
    width: 200px;
    top: 70px;
    margin: 0 0 0 100px;
}


Il se positionne au-dessus de mon image et non a sa droite. Je vous mets une photo :

upload/1572205787-77403-capture.png
Modifié par Efeelios (27 Oct 2019 - 20:50)
Salut

Au lieu d'une photo, pourrait-on avoir un lien ? pour tester en live ? ou alors est il possible que te recrées ton problème sur codepen ou autre ? merci.
Ok super on me comprends déjà mieux. Je crois donc que le texte n'est pas le soucis donc.

Bon j'ai vraiment essayé de mon côté et j'y arrive pas. J'aimerais créer une marge d'espacement un peu comme le site http://toutpaie.fr/index251019.html au niveau "Les services" la deuxième image, c'est un peu le rendu que je voudrais mais j'y arrive pas. Merci @aliasdmc mais c'est pas le résultat voulu Smiley smile .

Concernant l'exemple le positionnement est pas pareil mais le résultat voulu est là. (le texte a droite de l'image en bloc) ça doit porté un nom mais en tant que débutant bah je l'ai pas x)
Sujet clos
Aller à