[CSS] - <DIV> ma perchè non <SPAN> ? [mod]

Sto cercando di risistemare tutto il layout dell'homepage del mio sito, una volta tabellare, usando solo i CSS...

Si usa sempre div... div con float, senza, clear:both.. Secondo me è un gran casino... E ci si domanda come mai le persone usano le tabelle??

Ora... Come mai si usa sempre <DIV> e mai <SPAN>? non è molto piu pratico? Due span possono mettersi l'uno di fianco all'altro senza problemi...

Se usassi SPAN contravverei alle leggi del CSS? Nel senso... Sarebbe come rinunciare al vantaggio in velocità e accessibilità dato dai CSS?

Poi ho questo problemino..

Sto cercando di sistemare il modulo di login alla destra del mio sito...

Vecchio Login tabellare è in questa pagina

Nuovo login che usa CSS è qui

Come mai "password dimenticata" non si stacca di 5px dal campo sovrastante ma vi resta incollato?

Questo è lo script:

print ("
 <form method=\"POST\" action=\"$adsf\" style='margin:0; padding:0'>
     <DIV class='headline' style='text-decoration:underline'>LOGIN</DIV>
                <DIV style='clear:both; width:100%; margin-top:5px;'>
                  <DIV style='float:left'><LABEL for='user'>Utente:</LABEL></DIV>
                  <DIV style='float:right'><input type=\"text\" name=\"user\" ID='user_name' value=\"\" SIZE=\"8\"></DIV>
                </DIV>
                <DIV style='clear:both; width:100%;'>
                  <DIV style='float:left'><LABEL for='passw'>Password:</LABEL></DIV>
                  <DIV style='float:right; margin-top:5px'><input type=\"passw\" name=\"password\" ID='password' value=\"\" SIZE=\"8\"></DIV>
                </DIV>
                <DIV style='clear:both; width:100%; margin-top:5px'>
              <a href=\"$modifica_dati_o_richiedi_password\">$modifica_dati_o_richiedi_password_value</a>
             </DIV>
                      <DIV style='clear:both; width:100%; margin-top:5px'><input align='left' type=\"submit\" name=\"submit\" value=\"Login\"></DIV>
                 
              <DIV style='clear:both; width:100%; margin-top:5px'><a href=\"$php_self?action=reg\">Non sei ancora registrato?</a></DIV>

"); 

Inoltre sto cercando di rifare i menu in <UL>, abbandonando le tabelle.

Come mai (sempre nella pagina CSS) il menu alla sinistra, quello in versione <ul> ha il pallino piu in alto rispetto alla linea di selezione che gli appartiene? non c'è modo di allinearli..

P.S. : Uso firefox... è probabile che negli altri browser funzioni tutto..


Ed ho anche altri problemi da risolvere... ad esempio se vario la dimensione del carattere del browser, l'immagine in alto non si modifica di dimensioni insieme al <div> di cui è sfondo, quindi resta piccola... bah... magari è meglio vederli uno ad uno sti problemucci...

[dementialsite]

... Ora... Come mai si usa sempre <DIV> e mai <SPAN>? non è molto piu pratico? Due span possono mettersi l'uno di fianco all'altro senza problemi...

Se usassi SPAN contravverei alle leggi del CSS? Nel senso... Sarebbe come rinunciare al vantaggio in velocità e accessibilità dato dai CSS? ...

L'unica differenza tra i due è che DIV è un tag di paragrafo, SPAN invece un tag non-paragrafo. Non credo ci sia contravvenzione di accessibilità, certo, se un browser non è in grado di interpretare un eventuale stile display:block che metti su SPAN per renderlo in tutto e per tutto uguale a un DIV, avrai che la tua pagina sarà un flusso unico di SPAN, senza ritorni a capo o interruzioni di linea.

Stammi bene...

[SolitaryExplorer]

Beh... !!!
DIV è un contenitore e serve a racchiudere parti o sezioni di codice in una pagina web.
SPAN è un elemento non contenitore, e quindi in linea, che può essere utilizzato per applicare dello stile ad un testo (per esempio).

Il discorso su paragrafo o non paragrafo è sbagliato.
L'unico elemento che identifica un paragrafo è P.

Perché si usa sempre DIV e mai SPAN?
Premesso che dipende da cosa tu vuoi realizzare, in genere sappi che le persone scrivono pagine web e fogli di stile senza avere la necessaria conoscenza e padronanza del linguaggio e della sintassi (non mi escludo neanch'io da questa categoria!).

Esempio concreto sono l'utilizzo delle tabelle per creare il layout, cosa estremamente sbagliata, dato che le tabelle hanno tutto un altro scopo.
Ma purtroppo quando si è agli inizi, questi sono gli errori "obbligati" che ognuno commette.

Poi è anche vero che realtà importanti insistono a divulgare cattivi insegnamenti sul come scrivere pagine web.
(Come ad esempio i template che Microsoft offre per FrontPage!)

Se vuoi approfondire meglio la mia argomentazione, guarda la ricerca che ho fatto.

[dementialsite]

...
Il discorso su paragrafo o non paragrafo è sbagliato.
L'unico elemento che identifica un paragrafo è P.
...

Quello che intendevo evidenziare, come hai fatto più giustamente tu, è che DIV è un tag che costringe i suoi contenuti a stare in un blocco, mentre SPAN sta all'interno di un flusso (magari dentro un DIV). Forse ho tradotto male con "tag di paragrafo" (block) e "tag non paragrafo" (inline), quindi per evitare confusione metto qui quello che intendevo:

- tag di paragrafo: P, DIV, TABLE, APPLET, HR, ...
- tag non-paragrafo: SPAN, A, B, I, U, STRIKE, IMG, NOBR, ...
- tag non appartententi ad alcuna delle categorie precedenti: TR, TD, META, LINK, ...

Stammi bene...

Beh mi sembre evidente che allora bisogna usare il piu possibile <DIV> rispetto agli altri no? La pagina dovrebbe formarsi piu rapidamente giusto?

[SolitaryExplorer]

Beh mi sembre evidente che allora bisogna usare il piu possibile <DIV> rispetto agli altri no? La pagina dovrebbe formarsi piu rapidamente giusto?

Non è semplice la questione!
Devi usare ogni tag al momento giusto.