28173 sujets

CSS et mise en forme, CSS3

Salut à tous,

J'ai un problème que j'ai du mal à définir, alors je poste une image, et le code css.

J'aimerais contraindre mon texte à rester dans ma background-image, une sorte de padding, ou de text-indent ... auriez vous une idée ? ou des suggestion pour mieux intégrer le scroller ...

je débute, c'est mon premier Css, soyez simpa einh !

merci d'avance de me donner un peu de votre temps !

Image aperçu:
upload/8620-1.jpg


 //CSS [bloc-droit]

#corps_d 
{
width:490px;
margin-bottom: 10px;
float: right;
/*border: 1px solid white;*/
padding:0px;
overflow:auto;
height:299px;
background-color:#2F004F;
background-image:url("corps_d.jpg");
background-repeat:no-repeat;
}




/*		 F O RM A T AG E   D U  B L O C     C O R P S _D	  */

.titre_contenu_corps_d{
font-size:1em;
color:#999966;
text-transform:capitalize;
font-weight:bold;
}

.contenu_corps_d{
font-size:0.8em;
color:#CCCCCC;
text-align: justify;
}

Modifié par ths_otra (26 Dec 2006 - 11:25)
ths_otra a écrit :
J'aimerais contraindre mon texte à rester dans ma background-image, une sorte de padding, ou de text-indent ...

Pourquoi une sorte de padding? Smiley hum Un padding tout simple appliqué à ta division #corps_d ferait tout à fait l'affaire non?
Euh ... suis confus là, oui effectivement, ça le fait ... Smiley langue merci ...

As-tu par hasard une idée pour masquer quand ça déborde mon background ?


Merci beaucoup !
ths_otra a écrit :
As-tu par hasard une idée pour masquer quand ça déborde mon background ?
Ben normalement, ça ne devrait pas arriver... Tu rencontres ce problème actuellement?

Au passage, si tu pouvais donner à ton fil un titre plus évocateur du problème rencontré, ça serait sympa pour les recherches futures Smiley cligne
Modifié par Benjamin D.C. (26 Dec 2006 - 12:29)
oui, regarde l'image plus haut je l'ai fait déborder exprès ... je ne comprends pas !

en fait, l'image avec le flou est a l'interieur de mon bloc. Le scroller et le texte ont comme limite le bloc pas l'image ... comment corriger cela ?

En plus, j'ai une sacrée différence entre IE et firefox:

firefox, mes images back sont par défaut en background-attachment:fixed;
IE, non et je le rajoute dans le css , ça fout un bordel montre

argh !!!!!!!
Modifié par ths_otra (26 Dec 2006 - 14:45)
Bon ok, encore une fois si j'avais cherché un peu plus .... grrr

la solution est là Merci Nanoum

/*exemple du css corrigé */

#corps_g/*Version IE*/
{
width:492px; 
margin-bottom: 10px;
/* border: 1px solid white;*/
float:left;
padding:0px;
overflow:auto;
height:400px;
background-attachment:fixed;
background-repeat:no-repeat;
}

div[id=corps_g] { /*Version Firefox*/
width:492px; 
margin-bottom: 10px;
/* border: 1px solid white;*/
float:left;
padding:0px;
overflow:auto;
height:400px;
background:#2F004F url("corps_g.jpg")!important;
background-repeat:no-repeat !important;
}


Pour le reste j'ai toujorus pas trouvé ....