Posizionamento assoluto e relativo in html

Messaggio da **aschenaz** » dom 16 set 2007, 11:51

In genere, io metto il border sul tag img:

img {border:none}

così mi tolgo il pensiero per tutte le immagini.

Ma funziona anche con border:0 (senza px).

Per quanto riguarda IE 6, il float funziona pure. Spesso è meglio, però, posizionare i blocchi float all'interno di un div contenitore. Così, ad esempio...

Codice: Seleziona tutto

<div>
  <p con float>
  <p con float>
  <p con clear>
</div>

IE è una brutta bestia. Non hai idea (o forse si

) di quanto tempo faccia perdere... A volte mi sembra che un sito è bello e finito, ma ho fatto i conti senza l'oste: vado a testarlo con ie e mi tocca fare un sacco di lavoro extra!

Ciao,
nino

Messaggio da **samiel** » dom 16 set 2007, 14:04

Mettendo

Codice: Seleziona tutto

border:0

su img funziona.
Non capisco perché invece usando l'ID
nell'HTML funziona e nel CSS no. Mistero...

Per quanto riguarda IE, leggendo dei manuali
ho visto che dà parecchio filo da torcere.
Il sito che avevo fatto con HTML 1.0 transitional
aveva una resa adeguata. (Prima ancora
l'avevo fatto coi frames, tutt cose che sto imparando:
sì, lo so che i frames non si usano più, ma
dovrò pur sapere anche queste cose...).
Invece adesso coi CSS tutte le immagini
che su FIrefox, Konqueror, Epifany sono centrate
inIE le vedo allineate a sinistra...

Studierò il caso!

Mille grazie per le risposte alle mie frequenti domande!!
Come quando iniziai a studiare un po' LaTeX
per preparare S4d 3°, sorgono un sacco
di problemi e dubbi...

M.

Messaggio da **aschenaz** » dom 16 set 2007, 18:11

samiel ha scritto: Invece adesso coi CSS tutte le immagini
che su FIrefox, Konqueror, Epifany sono centrate
inIE le vedo allineate a sinistra...
Studierò il caso!

IE non conosce ancora il css2.
Normalmente (coi browser degni di questo nome) basta mettere margin:auto per centrare un blocco all'interno di un altro blocco. Con IE, invece, bisogna mettere text-align:center a livello di blocco superiore. Così, conviene mettere entrambi le istruzioni:

Codice: Seleziona tutto

<p style="text-align:center">
  <img style="margin:auto" src="..." alt="..." />
</p>

Messaggio da **samiel** » lun 17 set 2007, 22:04

Sembra che con IE 7 le cose vadano meglio.
Forse conosco uno che ce l'ha, per il resto
le mie conoscenze hanno tutti XP craccato...

M.

Messaggio da **samiel** » mar 18 set 2007, 17:37

Character Encoding mismatch!
The character encoding specified in the HTTP header (utf-8) is different from the value in the XML declaration (iso-8859-1). I will use the value from the HTTP header (utf-8).

COsa curiosa... ho cambiato la codifica predefinita
a iso-8859-1 e mi dà questo warning anche quando
controllo un file in locale con un copia/incolla
nella pagina del validatore di W3C...
Ma qui in server non c'entra!
In questo caso, dove trova gli HTTP header?

Grazie
M.

Messaggio da **aschenaz** » mer 19 set 2007, 7:18

Ma non dicevi di aver messo utf-8 nel meta-tag?

Se si, correggi anche quello a iso-8859-1...

Messaggio da **samiel** » mer 19 set 2007, 21:24

Adesso ho provato a usare iso-8859-1 invece di utf.
Ho cambiato tutti e due i riferimenti, infatti ho:

Codice: Seleziona tutto

<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <meta name="GENERATOR" content="Quanta Plus" />
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

La cosa per me inspiegabile è che (usando la pagina
web del validatore di W3C), se carico la pagina in rete
e la valido da lì, tutto è ok. Se scelgo come metodo
di immissione l'upload dando l'indirizzo locale del file,
anche in questo caso tutto ok.
Se infine scelgo di verificare il file "by direct input",
cioè con un copia/incolla, allora e solo allora
mi rileva questo problema...
È schizzato ogni tanto il validatore
o mi sfugge qualcosa?

Grazie
M.

Messaggio da **aschenaz** » mer 19 set 2007, 22:02

Boh?! E' probabile che faccia riferimento al carattere standard del proprio server...

In ogni caso, la validazione che conta è quella col link diretto!

Interessante anche il validatore di firefox ( https://addons.mozilla.org/it/firefox/addon/2318 ).

Ciao,
nino

Messaggio da **samiel** » mer 19 set 2007, 23:54

Il proprio server? Chissà...
Ho installato l'estensione di Firefox.
Non sembra male...
Grazie della segnalazione

M.

Messaggio da **samiel** » gio 20 set 2007, 17:42

Codice: Seleziona tutto

Con IE, invece, bisogna mettere text-align:center a livello di blocco superiore. Così, conviene mettere entrambi le istruzioni:

A questo difetto si può ovviare, almeno nel caso
che ho potuto verificare di persona, anche solo
evitando di aprire il file html con la dichiarazione
xml e mettendo prima il DOCTYPE.

Probabilmente sto facendo una domanda assurda,
ma ho letto diverse cose sui comandi condizionali
per correggere i bug di IE. Nel caso si tratti di un problema
soltanto, si può piazzare qualcosa dentro il CSS
solo nei casi dove serve?
E se devo creare un file CSS esterno da richiamare con la solita invocazione
<!--[if lte IE 6]> ecc ecc, devo copiare tutto il codice per modificare solo
l'istruzione sulle immagini centrate? O c'è un modo per abbreviare il tutto?

Grazie
M.

Messaggio da **aschenaz** » gio 20 set 2007, 19:38

samiel ha scritto:E se devo creare un file CSS esterno da richiamare con la solita invocazione
<!--[if lte IE 6]> ecc ecc, devo copiare tutto il codice per modificare solo
l'istruzione sulle immagini centrate? O c'è un modo per abbreviare il tutto?

Personalmente non ho mai adottato questa tecnica.
Ma, considerando che tu puoi richiamare più di un foglio css (anzi, spesso è buona norma fare fogli diversi, specialmente nel caso in cui vuoi fare una formattazione diversa per la stampa...), puoi inserire solo le voci che ti interessano in un secondo foglio.

Di norma, il css valido è sempre l'ultimo richiamato in ordine di tempo. Quindi, se io scrivo...

Codice: Seleziona tutto

p {margin:0}
p {margin:1px}

il margine sarà di 1 px.

C'è anche un'altra possibilità: quella di utilizzare il flag !important, che IE non capisce e che può servire per dire ai browser seri di utilizzare il css con quel flag. Ad esempio, avendo...

Codice: Seleziona tutto

p {margin:0 !important}
p {margin:1}

Il margine, coi browser seri sarà 0, con IE, sarà 1.

Ciao,
nino