Newsgroup: it.comp.www.html
Titolo: CSS - Testo allineato in alto a sx in una cella

Mi sto perdendo in un bicchier d'acqua.
Devo allineare una stringa (un numero) in alto a sinistra di ogni cella 
di una tabella.
Vorrei non usare vertical-align e text-align perché all'interno di 
qualche cella c'è un'immagine che dev'essere centrata.
Se metto position: absolute e left/top a 0 mi porta tutte le scritte 
nell'angolo in alto a sx della tabella, se metto relative mi sposta 
l'immagine eventualmente presente (e comunque non mi mette la scritta 
nell'angolo della cella)...
Spero di essermi spiegato!
-- 
Jax
--
Newsgroup robomoderato - gli articoli vengono approvati automaticamente

 nell'angolo della cella)...
Un metodo potrebbe essere aggiungere un contenitore all'interno di ogni
cella e metterci il testo, ad esempio:
html:
<td>
    <span>Testo</span><img src="..." />
</td>
css:
td {
    position: relative;
}
td span {
    position: absoute;
    top: 0;
    left: 0;
}
Ma, ovviamente, dipende sempre da cosa devi fare...
Ciao
-- 
Alan
"Ci spiace, ma il lucro è indispensabile."
http://www.qreate.net


 Ma, ovviamente, dipende sempre da cosa devi fare...
Tra i vari tentativi avevo provato anch'io a "gabbare" in questo modo la 
tabella, ma senza successo: cosě gli span vengono comunque tutti 
nell'angolo in alto a sx della pagina.
Per capirci, sto cercando di costruire un modulo php per un amico: data 
una stringa deve costruire una damiera con dei pezzi eventualmente 
presenti su di essa. Mi č sembrato logico creare una table al volo, 
costruendo le varie caselle come se fossero le celle... il problema č 
che le caselle nere devono essere numerate, per questo ho bisogno del 
numeretto in alto a sx (o in qualunque altro posto, basta che sia una 
posizione assoluta rispetto alla singola cella).
-- 
Jax


 Ma, ovviamente, dipende sempre da cosa devi fare...
Ti anticipo anche il mio secondo tentativo: ho creato un div con width e 
height=100% per ogni cella: in questo modo posso usare il 
position:absolute, ma non posso più usare il vertical-align, che è 
riservato alle table-cell :(
Ovviamente se al div applico la proprietà display: table-cell per poter 
usare il vertical-align, si ripresenta il problema del posizionamento 
dei numeri.
Se ci fosse un modo alternativo per allineare verticalmente un'immagine 
in un div...
-- 
Jax


 nell'angolo in alto a sx della pagina.
Nah. Se usi il codice suggerito da Alan quel "relative" sposta
il riferimento assoluto su di ogni casella, che è quello che vuoi
tu, mi pare di aver capito.
-- 
blog 
http://blog.deelan.com/
pics 
http://redpunk.com/
lnks 
http://del.icio.us/deelan


 posizione assoluta rispetto alla singola cella).
E' esattamente quello che ti ho fatto. Metti uno span dentro ogni cella
e ci metti il numero. Cos'è che non ti ridà?
Se stai davvero facendo una specie di scacchiera e le immagini altro non
so che i pezzi, aggiungi questo nel css:
td img {
    display: block
    margin: 0 auto
}
Ciao
-- 
Alan
"Ci spiace, ma il lucro è indispensabile."
http://www.qreate.net


 in un div...
Un modo semplice è metter l'immagine come background del div..
Ciao
-- 
Alan
"Ci spiace, ma il lucro è indispensabile."
http://www.qreate.net


 }
Intanto che aspettavo qualche risposta ho risolto giocando con il 
padding e le misure in em, ma domani mattina rileggero il thread con più 
attenzione, probabilmente mi è sfuggito qualcosa.
Grazie a tutti comunque.
-- 
Jax


 presenti su di essa
invece di usare l'immagine della pedina/dama usa l'immagine comprensiva 
dello sfondo, dimensionata esattamente come la cella in modo che se anche 
fosse allineata in alto a destra resterebbe comunque centrata :)
certo che cosě facendo non potrai mettere il numerino nelle case 
occupate... :(
-- 
/-\ /\/\ /\/\ /-\ /\/\ /\/\ /-\ T /-\


 fosse allineata in alto a destra resterebbe comunque centrata :)
Ci avevo già pensato, ma ho scartato questa tecnica perché così facendo 
non potrei avere uno sfondo diverso dal solito bianco/nero, se uno lo 
volesse (tipo marmorizzato). Inoltre sarei blindato ad una dimensione 
fissa delle celle, altra cosa che vorrei cercare di evitare.
-- 
Jax


 fissa delle celle, altra cosa che vorrei cercare di evitare.
Basta utilizzare una png o una gif trasparente.
Ci ho giocato 20 minuti e ho fatto questo:
http://www.qreate.it/public/scacchiera
L'unico problema è che  le celle non hanno una chiara funzione quando si
usa position relative. Alcuni browser vanno correttamente, alcuni no..
Quindi ci devi mettere un div dentro, come stavi già facendo..
Ciao
-- 
Alan
"Ci spiace, ma il lucro è indispensabile."
http://www.qreate.net
