Comment créer un bloc responsive et forcer une URL à ne pas dépasser de ce bloc sur les mobiles

Vous avez sans doute remarqué que lorsqu'on met une url dans un bloc et que l'on regarde sa page sur un mobile, l'url dépasse du bloc

Il est assez simple de résoudre ce problème en CSS

Voici un exemple d'un bloc au coté arrondis avec couleur de font, ombrage sur le texte et sur le bloc et url qui descend à la ligne pour affichage sur mobiles

.reseau {
/* ICI LE BLOC */
	width:61%;
	height:auto;
	padding: 10px;
	border-radius: 8px;
        background:#fec354;
       border: 1px solid;
       border-color:#d29a3a ;
/* ICI OMBRAGE AU TEXTE */
    text-shadow:0 1px 0 #fee1a0;
/* ICI OMBRAGE AU BLOC */
    -webkit-box-shadow:0 1px 1px #d4d4d4, inset 0 1px 0 #fed17e;
    -moz-box-shadow:0 1px 1px #d4d4d4, inset 0 1px 0 #fed17e;
    box-shadow:0 1px 1px #d4d4d4, inset 0 1px 0 #fed17e;
/* ICI POUR EMPÊCHER L'URL DE DÉPASSER DU BLOCl */
	word-wrap : break-word ;
	-ms-mot-break : break-tout ;
mot-break : break-tout ;
mot-break : break-word ;
-webkit-tirets : auto ; 
-moz-tirets : automobiles ; 
traits d'union : auto ; 
	}

voici un exemple de code CSS appliqué un un div ayant comme nom de class .reseau

Vous pouvez voir des exemples en bas de chaque page dans la rubrique Extensions Joomla