gerarchia CSS

[spqr]

Ho impostato su un css esterno il tag TABLE avente larghezza 700.

Ora non riesco a impostare nelle pagine che utilizzano tale css delle tabelle con larghezza diversa da 700.
Infatti se imposto <table width="500"> la tabella rimane a 700, seguendo i comandi del css secondo cui "table {width: 700px}"

Come posso fare a risolvere il problema? forse ho sbagliato quando ho creato il css?

ciao e grazie

[Furcas]

se vuoi usare misure di width diverse tabella a tabella devi allora usare delle classi, altrimenti il browser trovando nel css il valore del larghezza delle tabelle settato a 700, lo userà per tutte, proprio perchè in questa maniera tu hai detto in pratica che ogni table deve essere larga 700.

devi, nel tuo caso, usare delle classi, nel foglio di stile, in questa maniera:

table.uno {width: 700px;}
table.due {width: 500px;}

quindi per la tabella che vuoi di 700 devi scrivere nel codice:

<table class="uno"></table>

e per quella di 500

<table class="due"></table>

[spqr]

grazie.
Quindi non c'è altro modo di operare, nel senso che non posso tramite l'html annullare gli effetti di un css...

Un'ultima cosa: se invece delle classi utilizzo gli ID è lo stesso vero? Non ho mai capito quando sia meglio usare l'uno e quando l'altro....

[antos]

volendo potresti usare i css in linea
scrivendo

<table style="width:xxpx">
...

oppure se la tabella di 700px è unica nella pagina gli puoi assegnare un id e quindi attribuirne unos tile in questo modo:
css esterno
#idtable{windth:700px}
html
<table id="idtable">

le classi e gli id non sono la stessa cosa...
le classi sono un gruppto di elementi nella sessa pagina che hanno lo stesso stile (per esempio i link di un menu), invece gli iddefiniscono un elemento univoco all'interno di una pagina quindi non potrai avere 2 elementi con lo stesso id!!!

[Martin_fly]

Ma nn è più semplice NoN mettere la table nei css

[spqr]

Originariamente inviato da Martin_fly
Ma nn è più semplice NoN mettere la table nei css

io uso molto spesso TABle ed è comodo avere preimpostata la formattazione.

Pe la differenza tra classe e ID onestamente... non ho ancora capito, ma non preoccuparti, grazie lo stesso!

[antos]

forse mi sono spiegato male io...
ma in sostanza alla fine in una pagina puoi definire più elementi con la stessa classe, mentre ogni elemento ha un suo id (2 elementi non possono avere lo stesso id) ora puoi formattare un elemento o identificandolo per classe di apapartenenza oppure usando il suo id

[spqr]

Originariamente inviato da antos
forse mi sono spiegato male io...
ma in sostanza alla fine in una pagina puoi definire più elementi con la stessa classe, mentre ogni elemento ha un suo id (2 elementi non possono avere lo stesso id) ora puoi formattare un elemento o identificandolo per classe di apapartenenza oppure usando il suo id

Nei vari manuali on-line leggo sempre che "un selettore ID può essere adoperato una volta soltanto all'interno di un documento, mentre una classe non ha praticamente alcun limite e può essere richiamata più volte".
Ma che significa? non riesco proprio a capire visto che un id io in una pagina lo uso più volte.

Inoltre per creare un ID io ho sempre scritto: tr#center, oppure p#uno; insomma, sempre preceduto dall'elemento a cui volevo applicare lo stile, invece si creano anche così #center (oppure #uno)?

Puoi farmi un esempio pratico?

GRAZIE!

[antos]

allora in una pagina puoi scrivere
<div id="idElemento" >
<p class="testo">text


<p class="testo">text


<p class="testo">text


<p class="testo">text


....
</div>
ma non puoi avere:
<div id="idElemento" >...</div>
<div id="idElemento" >...</div>

nel codice css:
puoi usare sia
#idElemento {...} che div#idElemento{...} o counque nometag#idElemento{...}

invece per le classi
.nomeclasse{} oppure nometag.nomeclasse{...}
spero di aver chiarito i tuoi dubbi

[Andrea1979]

sempre più difficile: è possibile avere due classi diverse nello stesso css che definiscono ciascuna le proprietà di uno stesso tag a modo loro? Mi spiego: vorrei fare una pagina in cui sono presenti 2 menu di navigazione, uno a sx e l'altro a dx del corpo centrale.
I menu sono semplicemente tabelle di due righe -una per l'intestazione del menu, l'altra per il conenuto-. Adesso, io vorrei che tutti i link conenuti nei menu di sx siano di colore rosso e tutti i link nei menu di dx siano di colore blu (ogni riferimento politico è davvero casule...).
Questo è il codice per la gestione del layout dei menu... chi mi sa aiutare un pochino?

.leftbox {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
font-weight: lighter;
color: #33CCFF;
border: 1px solid #6699FF;
width: 120px;

}
.leftboxtop {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
font-weight: bold;
color: #FFFFFF;
background-color: #6699ff;
text-align: center;
border: 1px solid #6699ff;
}


.rightbox {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
font-weight: lighter;
color: #FF3333;
border: 1px solid #FF0099;
width: 120px;

}

.rightboxtop {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
font-weight: bold;
color: #FFFFFF;
background-color: #FF0099;
text-align: center;
border: 1px solid #FF0099;
}

body {
background-color: #333333;
}


Ho provato (ingenuamente!!!) a fare qualcosa del tipo

a.leftbox:link {//qui lo stile}

e via dicendo per ciascuno stato di un link in ciascuno dei due menu, ma non succede niene