come cambiare la visualizzazione

[the_marlin]

sto provando a modificare un sito di un libro , dopo vari problemi ( relativi al php ) sono riuscito a venirne per ora a capo , ora sto tentando di modificare la visualizzazione di una pagina dove c'e una lista di nomi e dati ( come vedete qui sotto ) disposto su una riga , io vorrei spostare il tutto su 2 o 3 colonne in modo tale da avere 6 dati di persona su 2 righe o 3 come , dove devo modificare per far in modo di visualizzarli su 2 o 3 colonne ?

<li class="row0">
<h2>Sally Smith</h2>


Position:

Email: sally@example.com

Phone: 515-555-1235
</p>

<li class="row1">
<h2>Sarah Finder</h2>


Position: Lost Soul

Email: finder@a.com

Phone: 555-123-5555
</p>



questo è il css che riguarda row0
codice:

ul.ulfancy {
list-style: none;
padding:0;
margin-top: 20px;
}
ul.ulfancy div.list-photo {
float: left; padding: 10px;
margin-right: 10px;
background-color: #fdf2f2; }
ul.ulfancy li.row0 div.list-photo {
background-color: #f2fdfd;
}
ul.ulfancy h2 {
font-size: 1.2em;
}
ul.ulfancy li {
margin: 0;
list-style: none;
background-color: #f2fdfd;
}
ul.ulfancy li.row0 {
background-color: #fdf2f2;
}

ps spero di averci azzeccato con il titolo sto giro , qualora non ci prendessi ( visto che sono un principiante ) invece di chiuderlo modificate il titolo (cosi forse capisco anche io dove sbaglio ) grazie

[Enkh]

css aggiungerei queste 3 classi

 
.box {width: 200px;} 
.left { float: left; } 
.clear { clear: both; }

html con 6 oggetti così

 

<li class="row0 left box">
    <h2>Sally Smith</h2> 
    

Position: 

    Email: sally@example.com

    Phone: 515-555-1235
</p>
   

  <li class="row1 left box"> 
    <h2>Sarah Finder</h2> 
    

Position: Lost Soul
 
    Email: finder@a.com
 
    Phone: 555-123-5555
</p> 
  

  <li class="row1 left box"> 
    <h2>Sarah Finder</h2> 
    

Position: Lost Soul
 
    Email: finder@a.com
 
    Phone: 555-123-5555
</p> 
  

  <div class="clear"></div>

  <li class="row0 left box">
    <h2>Sally Smith</h2> 
    

Position: 

    Email: sally@example.com

    Phone: 515-555-1235
</p>
   

  <li class="row1 left box"> 
    <h2>Sarah Finder</h2> 
    

Position: Lost Soul
 
    Email: finder@a.com
 
    Phone: 555-123-5555
</p> 
  

  <li class="row1 left box"> 
    <h2>Sarah Finder</h2> 
    

Position: Lost Soul
 
    Email: finder@a.com
 
    Phone: 555-123-5555
</p> 
  

  <div class="clear"></div>

[ac_socmel]

Originariamente inviato da Enkh

 
...
  

  <div class="clear"></div>

  <li class="row0 left box">
...

non è corretto usare un <div> tra i[*]
e il risultato sarà certamente imprevedibile
meglio usare le dimensioni "width" per <ul> e[*] con il "float"

[Enkh]

Originariamente inviato da ac_socmel
non è corretto usare un <div> tra i[*]
e il risultato sarà certamente imprevedibile
meglio usare le dimensioni "width" per <ul> e[*] con il "float"

giusto, avevo in testa dei div non li

[the_marlin]

grazie mille per l'aiuto , ora ho una domanda volendo inserire uno spazio bianco tra una linea e l'altra cosa devo inserire .... cosi da far sembrare separati !