Eliminare bordo tabella senza affidarsi a cellspacing

[is-katsura]

Ciao a tutti!
E' la prima volta che scrivo su questo forum, anche se lo seguo spesso e molte volte ho trovato la soluzione a problemi per me irrisolvibili!
E' da poco che studio javascript, per interesse personale; per sbattere subito la testa nelle problematiche della programmazione con js, sto programmando una tabella dinamica.

I miei problemi cominciano quando a questa tabella ho voluto aggiungere lo scroll, del solo corpo: con FF mi e' bastato utilizzare la proprieta' overflow su tbody, con IE purtroppo questo non e' possibile.
Dopo un po' di ricerche su internet, ho allora deciso di procedere cosi: ho incorporato la tabella in un div, del quale utilizzo la proprieta' overflow per lo scroll; tramite setExpression, tengo i titoli di colonni fissi a "top". In questo modo faccio uno scroll, di fatto, su tutta la tabella, ma l'effetto e' che lo scroll sia solo del corpo.
Il problema e' quello che si vede nell'immagine sotto:



Come si vede nei titoli colonna dei giorni 8, 10, da 13 a 17, 20, c'e' un bordo fastidiosissimo tra la tabella e il div, che e' davvero brutto esteticamente e svela il "trucchetto" utilizzato per lo scroll.
Dopo qualche prova, sono riuscito a rimuoverlo solo settando il cellspacing della tabella a 0, ma cosi cambio completamente l'estetica di tutta la tabella. La mia domanda e' quindi questa: c'e' un modo che mi sfugge per annullare da js il bordo della tabella?
Scusatemi se mi sono dilungato e grazie dell'attenzione,
Luca

[cavicchiandrea]

Benvenuto, sul forum.
Il problema e nei css, che tu utilizzi js o meno poca importa sempre sui css dovrai lavorare.
Non essendo un esperto di css forse potresti impostare cellspacing a 0 e con i css spaziare righe (tr) e celle (td) ma in tutti i casi fatti spostare la discussione nel forum css (segnala al moderatore)

[is-katsura]

Originariamente inviato da cavicchiandrea
Benvenuto, sul forum.
Il problema e nei css, che tu utilizzi js o meno poca importa sempre sui css dovrai lavorare.
Non essendo un esperto di css forse potresti impostare cellspacing a 0 e con i css spaziare righe (tr) e celle (td) ma in tutti i casi fatti spostare la discussione nel forum css (segnala al moderatore)

Prima di tutto ti ringrazio per la risposta.
La soluzione che mi proponi, del cellspacing a 0 con spazio tra righe e colonne, l'avevo gia' provata utilizzando la proprieta' border sulle celle della tabelle, ma il risultato non mi era piaciuto molto.
Piu che altro, da inesperto di js, credo ci sia un modo, che non conosco, di cancellare quel bordo senza annullare lo spazio tra le celle, e questo mi incuriosisce molto.
Ho accettato il tuo consiglio e richiesto lo spostamento, speriamo bene!
Luca

[Mich_]

Non so con che codice (HTML+CSS) hai realizzato la tabella, ma in linea di massima NON si devono utilizzare formattazioni HTML in concomitanza con i CSS. Il problema e` che i due tipi di formattazione sono in conflitto, e i browser risolvono i conflitti a modo loro (ciascuno in modo diverso).

Quindi devi ELIMINARE tutte le formattazioni realizzate tramite attributi HTML, meglio se usi la DTD XHTML 1.0 strict.
La formatazione deve essere realizzata solo tramite CSS.
Le singole righe e celle sono oggetti di tipo blocco, e quindi supportano i vari magin, border, padding. Browser diversi hanno default diversi, quindi e` buona norma definire sempre esplicitamente tutti 4 i valori per tali attributi.


PS: lascia stare il JS. Prima sistema HTML e CSS; poi se hai necessita` di JS potrai usarlo, ma prima devi realizzare tutto in modo statico.

[is-katsura]

[QUOTE]Originariamente inviato da Mich_
Non so con che codice (HTML+CSS) hai realizzato la tabella, ma in linea di massima NON si devono utilizzare formattazioni HTML in concomitanza con i CSS. Il problema e` che i due tipi di formattazione sono in conflitto, e i browser risolvono i conflitti a modo loro (ciascuno in modo diverso).
[\QUOTE]
In realta' creo la tabella da javascript ( con document.createElement(tag) ), e posiziono gli elementi con appendChild. A ogni elemento creato assegno dei CSS scrivendone il nome nella proprieta' "className" (sempre da codice js, ho cercato di fare tutto il piu' dinamico possibile per imparare javascript).
A volte, in aggiunta ai CSS, modifico delle proprieta' di stile direttamente da js (obj.style.unaQualcheProprieta): mi stai dicendo che o faccio tutto da CSS o da javascript? Scusami la domanda forse stupida, ma non so se modificare le proprieta' style di un elemento da js equivale a modificare un attributo HTML (penso di si), quindi non capisco bene se sto utilizzando HTML + CSS.

La formatazione deve essere realizzata solo tramite CSS.

Come sopra: le proprieta' style degli oggetti in javascript meglio lasciarle perdere definitivamente, per evitare di mettere in crisi il browser? Nel senso che i CSS mi danno molta generalizzazione, tra CSS e scrivere lo stile in js sceglierei sicuramente i primi.

Di nuovo scusami per le domande stupide, sono all'inizio e mi rendo conto di avere un po' di confusione in testa.
Luca

[Mich_]

Originariamente inviato da is-katsura
Come sopra: le proprieta' style degli oggetti in javascript meglio lasciarle perdere definitivamente, per evitare di mettere in crisi il browser? Nel senso che i CSS mi danno molta generalizzazione, tra CSS e scrivere lo stile in js sceglierei sicuramente i primi.

Per me questa prosa e` incomprensibile.

Se vuoi aiuto, posta il codice HTML e CSS del pezzo interessato (e il DOCTYPE della pagina) oppure posta il link.

Una pagina Web dovrebbe essere realizzata da due (o tre) parti:
1. marcatura e contenuto (codice HTML)
2. formattazione (codice CSS)
3. (opzionale) interazione (eventi/movimenti) (codice JS)
(in piu` ci possono essere interazioni con il server - ad es. AJAX -, ma la cosa diventa sempre piu` complessa)

E` importante seguire l'ordine durante lo sviluppo ed e` importante tenere separati i livelli, altrimenti si aumenta la confusine e non si riesce a fare una cosa seria e funzionante.

Quindi:
1. sistemare il codice HTML seguendo le regole SEMANTICHE
2. sistemare la formattazione mediante i CSS
Se queste cose sono fatte bene, poi si puo` modificare qualcosa tramite JS; se le prime sono confuse aggiungere il JS moltiplica la confusione.

[is-katsura]

Originariamente inviato da Mich_
Per me questa prosa e` incomprensibile.

Se vuoi aiuto, posta il codice HTML e CSS del pezzo interessato (e il DOCTYPE della pagina) oppure posta il link.

Una pagina Web dovrebbe essere realizzata da due (o tre) parti:
1. marcatura e contenuto (codice HTML)
2. formattazione (codice CSS)
3. (opzionale) interazione (eventi/movimenti) (codice JS)
(in piu` ci possono essere interazioni con il server - ad es. AJAX -, ma la cosa diventa sempre piu` complessa)

E` importante seguire l'ordine durante lo sviluppo ed e` importante tenere separati i livelli, altrimenti si aumenta la confusine e non si riesce a fare una cosa seria e funzionante.

Quindi:
1. sistemare il codice HTML seguendo le regole SEMANTICHE
2. sistemare la formattazione mediante i CSS
Se queste cose sono fatte bene, poi si puo` modificare qualcosa tramite JS; se le prime sono confuse aggiungere il JS moltiplica la confusione.

Scusami, del resto come ti dicevo sono nuovo di js, e grazie della spiegazione, che vedro' di mettere in pratica!
Non mi dilungo ulteriormente perche' ho capito come risolvere il tutto: basta dare a thead un colore di sfondo! In questo modo, il colore di sfondo impostato va a nascondere qualsiasi cosa presente dietro thead! Era davvero facile...
Grazie per l'aiuto,
Luca