Placement image qui décale le texte

**Roxtir** · 15/01/2014, 12h02

Bonjour à tous,

Un petit soucis que je n'arrive pas à expliquer concernant le placement d'une image devant un texte...
J'ai mon texte qui est centré grâce à une section placé dans un body d'une certaine largeur et je souhaite placé une image à coté d'un de mes paragraphes donc j'ai utilisé le code CSS suivant pour mon image :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
#imggarantie
{
	display: inline-block;
        position: relative;
	z-index: 1;
	width: 350px;
 
}

Seulement lorsque je décide de placer mon image grâce à left/right elle décale le texte ou créer des espaces ... J'ai regarder au niveau css de mes sections et body rien n'a pour consignes de créer des espaces ou autre ... j'ai seulement un margin-top pour mes paragraphes dans l'une de mes sections

**Mell** · 15/01/2014, 15h34

Donnes nous ton HTML en plus de ton CSS.

Voir, utilise ce site et insères-y ton code pour que l'on comprenne mieux le soucis et que l'on puisse t'aider d'avantage

http://jsfiddle.net/

**Roxtir** · 15/01/2014, 15h44

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

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
<section id="centre">
 
            <p>blabla</p>
            <p>blabla</p>
 
                <section class="centregarant"><h2 class="hgarant">Charte d’Éthique :</h2>
                <p>blabla </p>
                <p>blabla</p>
                <p>blabla</p>
 
            <p>blabla</p>
 
                <h2 class="hprest">blabla:</h2>
            <p>blabla 3</p>
            <p>blabla</p>
            <p>blabla</p>
            <p>blabla</p>
            <p>blabla <br/>
                blabla<br/> <span class="note">blabla</span><br/>
                blabla<br/><span class="note">blabla</span><br/>blabla<br/><span class="note">blabla</span></p>
 
 
                    <br/><p>blabla</p>
</section>
 
 
    </section>

css

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
#centre
{
    display: inline-block;
    vertical-align: top;
    width: 600px;
    margin: 0 30px;
}
 
.centregarant
{
margin-top: 1.5em;
}

Je n'ai pas mis le code css de l'image volontairement dans cette réponse

**Mell** · 15/01/2014, 15h52

Tu veux quelque chose comme ça ?
http://jsfiddle.net/fy3y7/

Le bloc noir remplace l'image

Je ne comprend pas trop ton histoire d'image.

**Roxtir** · 15/01/2014, 17h11

Non mell, je voudrais pouvoir placer l'image n'importe où devant le texte.
Que tout le texte soit centré et en arrière plan et que l'image je puisse mettre l'image n'importe où devant le texte