Titre: problème css
Posté par: Dédé le le 19-09-2006 a 19:04:53
Bonjour
en cette fin d'aprem, je passe mes dernières minutes de boulot à me prendre la tête sur un prob de CSS. Si quelqu'un avait la gentillesse de me filer un coup de main...
J'ai un div dans un autre div :
<div id="encadre_article">
<div id="surtitre_encadre_article">Surtitre de l'encadre</div>
<p class="titre_encadre_article">Titre de l'encadré</p>
<p class="txt_encadre_article">Texte de l'encadré</p>
</div>
Le div qui me pose problème est celui en rouge
L'identifiant #surtitre_encadre_article porte les caractéristiques CSS suivantes :
#surtitre_encadre_article{
background-color: #9e131c;
font-size: 11px;
font-weight: bold;
color: #fff;
width:130px;
padding-left: 5px;
padding-right: 5px;
text-transform:uppercase;
margin: 0px;
}
Je souhaite que ce div rouge puisse faire 2 choses mais en vain :
- se positionner centrer tout en haut de l'encadré
- que le bandeau rouge puisse s'agrandir ou se diminuer en fonction de la longueur du texte qu'il contient.
Merci d'avance de vos idées de génie ! |
Titre: Re:problème css
Posté par: OKKO le le 20-09-2006 a 14:39:35
a voir
j'ai formaté le margin de surtitre_encadre_article en:
margin:0 40% 0 40%;
en lui donant une dim de référence
#encadre_article {
width:100%;
height:auto;
}
<html>
<head>
<title>Document sans titre</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
#encadre_article {
padding:0;
margin:0;
border:1px solid gray;
width:100%;
height:auto;
}
#surtitre_encadre_article{
[color=Blue]padding:0 5px 0 5px;
margin:0 40% 0 40%;[/color]
width:133px;
height:auto;
background-color: #9e131c;
font-size: 11px;
font-weight: bold;
color: #fff;
text-transform:uppercase;
}
</style>
</head>
<body>
<div id="encadre_article">
<div id="surtitre_encadre_article">Surtitre frdsfsfsdfsfs de l'encadre</div>
<p class="titre_encadre_article">Titre de l'encadré</p>
<p class="txt_encadre_article">Texte de l'encadré</p>
</div>
</body>
</html>
|
Titre: Re:problème css
Posté par: bardamu le le 23-09-2006 a 12:33:43
Pour le 1er problème, essaye de rajouter à ton style :
#surtitre_encadre_article{
[color=Red]margin-right:auto;
margin-left:auto;[/color]
background-color: #9e131c;
font-size: 11px;
font-weight: bold;
color: #fff;
width:130px;
padding-left: 5px;
padding-right: 5px;
text-transform:uppercase;
margin: 0px;
}
|
Forum-webmaster | Actionné par YaBB SE
© 2001-2003, YaBB SE Dev Team. Tous droits réservés.
|