Per completezza aggiungo un piccolo accorgimento:
Siccome lo style "
{display:inline;} " che vi avevo proposto sopra
#breadcrumb div {display:inline;}
non viene più utilizzato, anzi per così dire molti nell'ottimizzazione dei siti web cercano di eliminarli o sostituirli, è possibile ovviare a questo sostituendo questo codice con questo stratagemma:
inserire ( al posto di quello proposto precedentemente che cancellerete ):
#breadcrumb div {float:left}
bisogna avere cura però, di eliminare il ( float: left; ) nella stringa superiore [ nell'esempio sotto è contenuto nella seconda stringa ], altrimenti si sfasa un pò tutto.. Eliminarlo sopra e inserirlo sotto nel seguente modo.
GUARDETE GLI ESEMPI E CONFRONTATELI ..
PRIMA:/* breadcrumbs and tools */
#main #top-nav { background: transparent; height: 32px; line-height: 32px; border-bottom: 1px solid #252525; }
#breadcrumb { float: left; width: 80%; font-size: 12px; color: #aaa; }
#breadcrumb a { color: #777; }
#breadcrumb a:hover { color: #6b9ccf; }
#breadcrumb .separator { margin: 0 6px; }
#breadcrumb div {display:inline;}
DOPO:
/* breadcrumbs and tools */
#main #top-nav { background: transparent; height: 32px; line-height: 32px; border-bottom: 1px solid #252525; }
#breadcrumb { width: 80%; font-size: 12px; color: #aaa; }
#breadcrumb a { color: #777; }
#breadcrumb a:hover { color: #6b9ccf; }
#breadcrumb .separator { margin: 0 6px; }
#breadcrumb div {float:left}
Spero di essermi spiegato bene