Validare Html e Css

[indigoindigo]

Ma

table{
border: 1px solid #C0C0C0;
}

non ti funge?

[Jigen]

table{
border: 1px solid #C0C0C0
}

Funziona ma non riesco ad ottenere l'effetto delle tabelle così com'è riportato sulla pagina che ho linkato precedentemente!

-----------------

<table style="height: 14px; width: 766px; border-color: #C0C0C0;">
.... style="background-image: url(img/header.gif);

Le soluzioni che mi hai postato prima dovrebbero risolvere il problema senza l'utilizzo dei css ma anche in questo caso non riesco ad ottenere l'esatto effetto che vorrei per le mie tabelle. Potresti dare un'occhiata al codice incriminato:

<table border="1" width="766" height="14" cellspacing="1" cellpadding="0" bordercolor="#C0C0C0" bgcolor="#FFFFFF">

Grazie.

[indigoindigo]

Aspetta! io le due pagine (quella buona e qualla non buona) le vedo uguali!

potresti farmi un disegno o qualcos'altro per spiegarmi l'effetto desiderato?

[Jigen]

Ok, di seguito troverai le immagini che ti aiuteranno a capire ciò che vorrei realizzare con i css.

Img 1 - Img 2


Dopo esser riusciti a riprodurre l'effetto con i css potremmo riprendere la strada del <table style="height: 14px;.....>? Così potrò scegliere quale delle 2 soluzioni adottare.


Grazie ancora.

[pierofix]

Forse una lettura al capitolo 'tabelle' di CSS 2.1 potrebbe chiarirti meglio il panorama:

- www.w3.org/TR/CSS21/tables.html

Più nel dettaglio, quello che ti serve è forse il codice seguente:

table
{
   border:1px solid #c0c0c0;
   border-spacing:2px;
}

- www.w3.org/TR/CSS21/tables.html#borders

[Jigen]

Sto cercando in tutti i modi di non complicare la vita a voi che mi state aiutando ma sinceramente pur seguendo alla lettere ciò che mi dite non riesco ad avere la giusta formattazione delle tabelle.

Ho inserito il tuo ultimo codice nel foglio di stile (tabelle.css), l'ho richiamato sulla mia pagina html e ho succesivamente modificato il tag <table> in modo tale che i vecchi attributi non entrassero in conflitto con i comandi presenti nel css:

<table border="1" width="766" height="14" cellspacing="1" cellpadding="0" bordercolor="#C0C0C0" bgcolor="#FFFFFF">

Questo su è il <table> che ho attualmente sulla mia pagina web e che non viene passato da W3C.

Cosa ho sbagliato!

Grazie comunque per la tua disponibilità.

[pierofix]

Originariamente inviato da Jigen
<table border="1" width="766" height="14" cellspacing="1" cellpadding="0" bordercolor="#C0C0C0" bgcolor="#FFFFFF">

I fogli di stile altro non sono che meravigliose praterie in cui parcheggiare gli attributi di stile che una volta stavano nel markup.

Immagina, ad esempio, la proprietà di 'bordo tabella', l'attributo border che tu hai scritto nell'HTML. Ora, salici a bordo e mettilo in moto. Vedi che ti stai spostando? Adesso segui le indicazioni per il CSS. La vedi la prateria? Bene: parcheggia lì.

Abbiamo appena tolto un attributo dal markup e lo abbiamo parcheggiato nel foglio di stile. Chiaro? E l'operazione va ripetuta per tutti gli attributi che fanno riferimento allo stile. Nel codice da te postato, sono: width, height, cellspacing, cellpadding, bordercolor e bgcolor.

Tolti tutti, nel markup otteniamo:

<table>

che, effettivamente, è l'unica cosa che ci serve, visto che il markup descrive, e non presenta. Questa è una tabella. Punto.

Nel CSS, poi, scriverai:

table
{
   width:766px; height:14px;
   padding:0;
   background-color:#fff;
   border:1px solid #c0c0c0; border-spacing:1px;
}

E il gioco è fatto.

[Jigen]

Grazie per la spiegazione elementare!

Spostati tutti gli attributi della tabella nel css questo è il risultato:
(mancano le doppie righe e la larghezza delle tabelle non è rispettata)

immagine



PS: ho rimosso le immagine che ho linkato precedentemente.

[pierofix]

Dobbiamo valutare sia il markup, sia il CSS: ce li puoi postare (riassunti)?

[Jigen]

Ok, ecco i codici:

tabelle.css

table
{
width:766px; height:14px;
padding:0;
background-color:#fff;
border:1px solid #c0c0c0; border-spacing:1px;
}

<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<link href="stile.css" rel="stylesheet" type="text/css">
<link href="tabelle.css" rel="stylesheet" type="text/css">
<title>Chi Siamo</title>

<script type="text/javascript" src="ricerca.js"></script>

</head>

<body topmargin="0" background="img/sfondo.gif">

<script type="text/javascript" SRC="moduli.js"></script>

<center>
<table border="1" width="766" height="14" cellspacing="1" cellpadding="0" bordercolor="#C0C0C0" bgcolor="#FFFFFF">
<tr>
<td width="766" height="115" valign="middle" colspan="2" background="img/header.gif">
[img]img/logo-web.gif[/img]

</td>
</tr>
<tr>
<td width="585" height="442" valign="top" bgcolor="#FFFFFF">

<script type="text/javascript" SRC="build-barra.js"></script>





<table border="0" cellpadding="0" cellspacing="0" width="553">
<tr>
<td>
<p align="right"><a href="javascript:history.back(1)">
[img]img/indietro.gif[/img]</a>
</td>
</tr>
</table>






<center>
<table border="0" width="530" height="1" cellspacing="3" cellpadding="0">
<tr>
<td width="530" height="19">[img]img/chisiamo.gif[/img]</td>
</tr>
<tr>
<td width="530" height="46" valign="baseline">
</td>
</tr>
<center>
</center>
</table>



</td>

<td width="586" height="442" valign="top" bgcolor="#FFFFFF">

<script type="text/javascript" SRC="build-menu.js"></script>




<script type="text/javascript" SRC="build-cerca.js"></script>

</table>
</center>

</body>
</html>

Nel codice della pagina html ho lasciato il <table> originale.
Ho semplificato il tutto in modo da facilitarti il lavoro.

GRAZIE.