28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai réussi à appliquer votre méthode css pour placer du texte entre 2 traits. Cependant j'ai 2 petits soucis. Je souhaite qu'il y ait un peu d'espace entre la fin du tait et le texte, à droite et à gauche du texte (j'arrive à le faire à gauche mais pas à droite)
Et je souhaiterais raccourcir de 10px le trait à droite du texte pour qui s'arrête au même niveau que le trait gris qui se trouve sous Actualités & Publications.

Site pour que vous puissiez regarder : www.dev-yesyouweb.com
La css concernée :

.actu p {
    position: relative;
    overflow: hidden;
    text-align: center;
     color: #8C8279;     
     font-size:16px;
     margin-bottom:0;
}
.actu p:before, .actu p:after {
    position: absolute;
    top: 51%;
    overflow: hidden;
    width: 50%;
    height: 2px;
    content: '\a0';
    background-color: #efefef;
}
.actu p:before {
    margin-left: -50%;
    text-align: right;
}

Merci de votre aide et bon après-midi !
Bonjour,

Ta solution fonctionne bien sur Firefox et Chrome mais pas sur safari et IE. J'ai pourtant ajouté kes préfixes. Une idée ? (dev-yesyouweb.com, Toutes nos actualités)


.actu p {
     display:flex;
      -webkit-display:flex;
       -ms-display:flex;
     color: #8C8279;     
     font-size:16px;
     margin-bottom: 32px;
}
.actu p:before, .actu p:after {
  content:'';
  flex:1;
    -webkit-flex:1;
    -ms-flex:1;
  border-bottom: 2px solid #EFEFEF;
  margin:auto 0.45em;
}