La Communauté Webmaster  forum rss


  Forum-webmaster
  Technique - programmation
  HTML / CSS / XHTML
(Modérateurs: Shain, Netah, Lilian, lauryv, ToToMaStEr)
  problème css
« Précédent Suivant »
Pages: [1] Descendre
Répondre    Aviser des réponses    Envoyer le sujet    Imprimer
  Auteur  Sujet: problème css  (Lu 805 fois)
problème css
« sur: le 19-09-2006 a 19:04:53 »
Dédé
Membre récent
*

Hors-Ligne

Messages: 1



Je suis un lama!

Voir le Profil
Répondre avec citation

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 !

Rapporter au modérateur  

Re:problème css
« Répondre #1 sur: le 20-09-2006 a 14:39:35 »
OKKO
Superactif
****

Hors-Ligne

Sexe: Male
Messages: 645



Gueulard Deluxe - Disponible à 25% -

Voir le Profil    WWW
Répondre avec citation

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{
padding:0 5px 0 5px;
margin:0 40% 0 40%;

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>

« Dernière Édition: le 23-09-2006 a 16:50:58 par OKKO » Rapporter au modérateur  

" Le raffinement est chose froide "
Re:problème css
« Répondre #2 sur: le 23-09-2006 a 12:33:43 »
bardamu
Membre récent
*

Hors-Ligne

Sexe: Male
Messages: 31





Voir le Profil    WWW
Répondre avec citation

Pour le 1er problème, essaye de rajouter à ton style :

#surtitre_encadre_article{
margin-right:auto;
margin-left:auto;

background-color: #9e131c;
font-size: 11px;
font-weight: bold;
color: #fff;
width:130px;
padding-left: 5px;
padding-right: 5px;
text-transform:uppercase;
margin: 0px;
}

Rapporter au modérateur  

Rechercher-Internet.fr : annuaire gratuit | PhotoReflets
Répondre    Aviser des réponses    Envoyer le sujet    Imprimer
Pages: [1] Monter
« Précédent Suivant »
Sauter à: 

Votre statut : Invité
Vous devez être membre pour participer.
 
 
Let’s Encrypt : le certificat SSL gratuit
Tester votre site internet sur différents navigateurs
[WordPress] Des problèmes avec l’administration ?
Rappel : Mettez à jour vos CMS et vos sites E-commerce
Le .fr fête ses 25 années d’existence !
Mesurer votre audience en temps réel avec BubbleStat
Porter réclamation contre Google Panda ?
Zlio n’est plus …
 
 
 
 
 

Copyright (c) Devclic 2002 - 2026 - Tous droits réservés

creation site internet strasbourg