comportamento errato in IE con div e posizionamento relativo/assoluto

[andrestu]

salve a tutti,
ho il seguente codice:

<div style=" position:relative; width:200px; top:0; left:0; ">

<immagine... style="width:100%; height:100%; position:absolute; top:0; left:0;" .../>

<testo... style="position:relative;">

<testo... style="position:relative;">

<testo... style="position:relative;">

<testo... style="position:relative;">

<testo... style="position:relative;">

<testo... style="position:relative;">

<testo... style="position:relative;">

<testo... style="position:relative;">

</div>

il problema è che in firefox viene codificato correttamente invece in IE no, volevo sapere se cera il modo di replicare lo stesso comportamento anche in IE...
Praticamente l'immagine viene allungata per tutta la lunghezza del div, la lunghezza del div viene data dal testo. Quindi il risultato finale è un box con del testo e l'immagine di sfondo che viene allungata x tutta la lunghezza del div.
Premetto che non posso impostare la lungheza del div in anticipo perchè non conosco la quantità del testo che sarà messo...
Le ho provate tutte, apparentemento non cè soluzione!!!
non credo che ce la fate anche mettendoci il massimo impegno, putroppo IE è nato male...

[andrestu]

a dimenticavo:
non posso usare neanche una background-image perchè la larghezza del div è dinamica (anche se x l'esempio lho impostata a 200px), e il background non devessere ripetuto ma è fisso centrale...

[Mich_]

Non ho capito.

Anzitutto perche` usi delle parole al posto dei tag.
Quello che chiami <testo> sono dei

? E perche` c'e` un
all afine? Non e` una cosa corretta dal punto di vista semantico. per spaziare i paragrafi, ti basta usare un margine in alto o in basso.

E, se capisco giusto, hai due blocchi sovrapposti; un'immagine e una serie di testi.
In quei casi conviene una struttura di questo tipo:

<div id="contenitore">
  <img ... />
  <div id="testo">
    

primo paragrafo </p>
    

paragrafo ... </p>
    ...
  </div>
</div>

Chiaramente al contenitore devi dare dimensioni, per poter definire 100% alle dimensioni dell'immagine e position:relative per poter usare l'absolute all'interno
l'Immagine e il #testo dovranno avere ambedue posizione assoluta
Invece i vari paragrafi non vanno posizionati (restano all'interno del #testo)

[andrestu]

grazie x la risposta (ho usato <testo... per intendere qualsiasi tipo di testo)

Ma purtroppo anche secondo il tuo suggerimento il problema rimane:
se la quantità del testo è dinamica (cioè può variare) come faccio a dare delle dimensioni al contenitore? così facendo il testo finirebbe per sforare...

la mia intenzione era dare all'immagine il 100% della lunghezza, al sua contenitore padre nessuna impostazione della lunghezza in modo che viene determinata dal contenuto del testo.

Ripeto, con mozilla si riesce a fare ma IE invece non interpreta bene il 100% se il suo contenitore padre non ha una lunghezza impostata

[Mich_]

IE ha dei problemi , soprattutto quando non definisci il tipo di documento (DTD) o lo definisci transitional.

Prova con una DTD Strict (la migliore per avere meno problemi e` attualmente XHTML 1.0 Strict )

[andrestu]

ok grazie, in effetti non ci ho mai pensato a provare a cambiare il tipo do documento.
Hai mica la stringa x intero, oppure un indirizzo dove posso trovare tutte le diverse stringhe che posso mettere?

[Mich_]

Ad esempio: http://www.w3schools.com/tags/tag_doctype.asp

(tratto da: http://www.w3schools.com/ che ti consiglio di mettere tra i tuoi preferiti )