Ciao a tutti!
ho un problema con la visualizzazione di una tabella e penso sia legato ai css che uso per il mio sito. Mi spiego meglio, la tabella che ho creato se la visualizzo in una pagina in cui carico anche i fogli di stile (al cui interno non hanno nessun attributo o classe per la tabella in questione) allora la tabella viene fuori senza bordi e con solo i contenuti delle celle; se, invece, elimino le righe in cui ci sono i riferimenti ai css, allora la tabella viene visualizzata correttamente.
Come mai c'è questo conflitto?
Come posso risolverlo?
Questa è il pezzo di codice in cui creo la tabella (sono all'interno del div content, quello principale diciamo):
Codice PHP:
<div id="content">
echo "<table class=\"rosa\" align=\"center\" width=\"380\" border=\"5\" cellspacing=\"1\" cellpadding=\"1\">";
echo "<tr><th width=\"200\">NOME</th><th width=\"80\">RUOLO</th><th width=\"100\">COSTO</th></tr>";
$qGioc = mysql_query("SELECT nome,ruolo,costo FROM giocatori WHERE allenatore='$utente'") or die("Query fallita: " . mysql_error());
while($arrGioc = mysql_fetch_array($qGioc, MYSQL_ASSOC)) {
echo "<tr><td align=\"center\">" .$arrGioc['nome'] ."</td>";
echo "<td align=\"center\">" .strtoupper($arrGioc['ruolo']) ."</td>";
echo "<td align=\"center\">" .$arrGioc['costo'] ."</td></tr>";
}
echo "</table>";
</div>
questo è il foglio di stile che uso:
/** con questa dichiarazione togliamo margin, border e padding a tutti gli elementi della pagina **/
* {
margin:0;
border:0;
padding:0;
}
body {
font: normal normal normal 90%/150% georgia, verdana, serif;
margin: 23px; /*si distanzia dal body di 23px*/
text-align: center; /* per IE5x */
/* background-color: #c0c0c0; */
background: url(image/linea.png) repeat;
color: #000000;
}
/** questo div fa da contenitore alla pagina **/
#container {
/* background-color: #fafad2; */
background: url(image/erba1.png) repeat;
color: #05052d;
border: 1px solid gray;
}
#header {
padding: 1.5em;
background: url(image/erba1.png) repeat;
/* background-color: #cc9900; */
}
#navigation {
float: left; /* faccio flottare il div a sinistra */
width: 18%; /* larghezza del div */
background-color: #fafad2;
color: #05052d;
border-right: 1px solid gray;
}
#extra {
float: right; /* faccio flottare il div a destra */
width: 18%; /* larghezza del div */
background-color: #fafad2;
color: #05052d;
border-left: 1px solid gray;
}
#content {
margin-right: 18%; /* margine pari alla larghezza del div#destro */
margin-left: 18%; /* margine pari alla larghezza del div#sinistro */
padding: 10px;
color: #0a0a0a;
background-color: #F0F8FF;
border-left: 1px solid gray;
border-right: 1px solid gray;
}
#content p{
text-align: left; /* ripristino l'allineamento a sinistra */
padding: 10px;
font-size: 100%;
letter-spacing: 2px;
}
#footer {
clear: both; /*importante al fine di far cessare il float degli elementi superiori*/
padding: 0.5em;
background: url(image/linea.png) repeat;
/* background-color: #cc9900; */
color: #000;
border-top: 1px solid gray;
}
#footer p {
padding: 5px
}
PS: forse sarebbe meglio che creassi una classe, tipo .table, e la inserissi nel mio css con gli attributi che voglio assegnare alla mia tabella, o no?