posizionamento testo

[sez]

Ciao,

mi piace molto come in maniera elegante e pulita hai di fatto creato una pseudo-tabella usando div e span !!

La richiesta che mi e' stata fatta e', nonostante le righe abbiano numerosita' differente, e' di allineare alcuni campi tra loro, es: tempor (nella tua 2nda riga) con magna (nella tua 3za riga). Considera che magna magari poteva anche apparire ad una riga differente....

Riflettendo un modo potrebbe essere quello di appoggiarsi ad una quadrettatura virtuale... qualcosa tipo:

     <div id="ruler" style="height:2vw;">
      <span style="position:fixed; left: 0vw; font-size:2vw;">0</span>
      <span style="position:fixed; left: 10vw; font-size:2vw;">10</span>
      <span style="position:fixed; left: 20vw; font-size:2vw">20</span>
      <span style="position:fixed; left: 30vw; font-size:2vw">30</span>
      <span style="position:fixed; left: 40vw; font-size:2vw;">40</span>
      <span style="position:fixed; left: 50vw; font-size:2vw;">50</span>
      <span style="position:fixed; left: 60vw; font-size:2vw;">60</span>
      <span style="position:fixed; left: 70vw; font-size:2vw;">70</span>
      <span style="position:fixed; left: 80vw; font-size:2vw;">80</span>
      <span style="position:fixed; left: 90vw; font-size:2vw;">90</span>
     </div>

     <div id="row1" style="height:2vw; border: solid 1px black;">
      <span style="background-color:gold; position:fixed; left: 10vw; font-size:2vw;">row1-item1</span>
      <span style="background-color:orange; position:fixed; left: 25vw; font-size:2vw">row1-item2</span>
      <span style="background-color:lime; position:fixed; left: 60vw; font-size:2vw">row1-item3</span>
      <span style="background-color:lightblue; position:fixed; left: 75vw; font-size:2vw;">row1-item4</span>
     </div>

     <div id="row2" style="height:2vw; border: solid 1px black;">
      <span style="background-color:gold; position:fixed; left: 10vw; font-size:2vw;">row2-item1</span>
      <span style="background-color:orange; position:fixed; left: 75vw; font-size:2vw;">row2-item2</span>
      <span style="background-color:lime; position:fixed; left: 20vw; font-size:2vw;">row2-item3</span>
     </div>

cosi' al campo x della riga y potrei comunque specificare da dove deve partire...

puo' avere senso ?