span che simuli una table-cell

[stardom]

mumble mumble
1) in alcuni casi il testo potrebbe non rimanere su una riga... per esempio, "volume affari" in alcuni casi è "movimentazione voli annuale", quindi più lungo, ma se sta nella sua "cella" non vedo che fastidio darebbe al testo a destra.
2) le icone potrebbero prendere spazio, ma è anche vero che non stanno dentro il <p>, sono generate altrove

.contact-info-sidebar .custom-info>p:before {color:#313131;content:"\f0ac";font-family:"FontAwesome";font-size:16px;padding-right:15px;padding-left:2px;}

3) le regole sono le seguenti (perchè, l'ordine influisce?)

.contact-info-sidebar p span {display:inline-block;width:30%;word-break:break-word;vertical-align:top;} /*span titolo*/
.contactinfodata {display:inline-block;width:55%!important;word-break:break-word;} /*span contenuto*/

Quindi non utilizzo un selettore "nome tag" (non saprei come utilizzarlo)
4) voglio ottenere che i titoli stiano al loro posto a sinistra/top ed il contenuto a destra/top ma se questo va a capo non deve andarsene sotto il titolo (appunto, come se fossero delle celle). Ho anche notato che testi lunghi (come quelli del campo sitoweb>link) non rispettano la loro posizione, e per questo sto usando word-break (anche se dovrò usare una proprietà non deprecata)

Dove sbaglio?

PS. nel mio vecchio sito era molto semplice, il titolo come <strong> e il contenuto con

position: relative; top: 5px; word-wrap: break-word !important;