web-dev-qa-db-fra.com

faire la balise span couvrir toute la largeur de div

J'ai la structure suivante pour html: -

<div>
  <span>
    <a href="wherever">Wherever</a>
  </span>
</div>

Si je veux que la travée couvre toute la largeur de la div, comment puis-je le faire en chrome?

J'ai essayé en CSS en utilisant

span{
  background:#FFF;
  width:100%;
}

Cela fonctionne dans Firefox et donc pas dans Chrome.

csswidthhtml
20
user1439090

Les éléments span sont en ligne. Les éléments en ligne ajustent automatiquement leur largeur et ignorent votre width: expressions.

Faites-le au niveau du bloc:

span {
    display: block;
}

Mais alors, c'est simplement un <div>.

47
Blender

Il existe deux façons de résoudre votre problème.

Au fur et à mesure que les balises span ajustent leur largeur en fonction de leur contenu. Donc, pour attribuer une largeur à cette balise, nous utiliserons float left with width.

span{
 background:#FFF;
 width:100%;
 float: left;
}

la voie secod consiste à utiliser le bloc d'affichage avec le code

 span{
 background:#FFF;
 width:100%;
 display: block;
}
2
aishazafar

Changez le CSS de span en:

span {
display: block;
}
1
KBN