Problema posizionamento testo con i CSS

[WarriorXP]

Ciao, ho da poco ultimato il restyling di un sito ma dopo tutto il lavoro che ho fatto ho notato che c'è un errore ricorrente nelle pagina (che hanno la stessa struttura).

In pratica nella colonna centrale di questo sito spesso il testo rimane posizionato a metà dello spazio a disposizione, poi con un refresh si posiziona tutto bene. E non accade neanche sempre... :master: Per adesso me lo ha fatto solo con Opera questo problema.

Un immagine illustrativa del problema è allegata, per favore aiutatemi, ci tengo a questo sito

[Phelix]

Ciao,
ho fatto qualche prova con Opera 7.1 e, in effetti, ho ricontrato il problema che descrivi...oltretutto - effettuando il refresh - a volte va tutto a posto, altre volte il problema si ripresenta daccapo anche dopo la sua apparente risoluzione.

Vorrei essere di maggiore aiuto, ma per ora mi associo alla tua perplessità :master: ...appena posso cerco di dare un'occhiata con calma al css per vedere se ci capisco qualcosa.

[WarriorXP]

UPPI!!

[Mich_]

Ho guardato il tuo sito, ma ha dei grossi problemi di visualizzazione. Ho usato Mozila 1.4 con una finestra del browser di circa 800x600

La pagina traborda la finestra sia a destra che a sinistra.
A destra si puo` vedere la fine mediante lo scrolling orizzontale, a sinistra no. Lo scrolling non funziona.

Anche la scritta nel primo riquadro a sinistra in alto esce dal riquadro (verso il basso): evidentemente anche qui usi dimensioni fisse, e non ti adegui alle dimensioni della scritta.

Ho dato un'occhiata al codice CSS, ed ho notato che usi dimensioni fisse per i div. Questo chiaramente limita molto l'usabilita` ed e` vietato dalle norme di accessibilita`.

Per come la vedo io, dovresti rivedere il progetto, usando solo dimensioni relative (% , em e simili). Un sito cosi` e` inutilizzabie dal mio punto di vista.

Ciao
Michele

[WarriorXP]

Originariamente inviato da Mich_
Ho guardato il tuo sito, ma ha dei grossi problemi di visualizzazione. Ho usato Mozila 1.4 con una finestra del browser di circa 800x600

La pagina traborda la finestra sia a destra che a sinistra.
A destra si puo` vedere la fine mediante lo scrolling orizzontale, a sinistra no. Lo scrolling non funziona.

Anche la scritta nel primo riquadro a sinistra in alto esce dal riquadro (verso il basso): evidentemente anche qui usi dimensioni fisse, e non ti adegui alle dimensioni della scritta.

Ho dato un'occhiata al codice CSS, ed ho notato che usi dimensioni fisse per i div. Questo chiaramente limita molto l'usabilita` ed e` vietato dalle norme di accessibilita`.

Per come la vedo io, dovresti rivedere il progetto, usando solo dimensioni relative (% , em e simili). Un sito cosi` e` inutilizzabie dal mio punto di vista.

Ciao
Michele

Ciao, ho scelto la dimensione fissa dei div perchè dei contenuti di questa portata sarebbero ingestibili con lo scrolling a risoluzioni inferiori

So che l'ideale sarebbe stato uno schema fluido ma io non sono riuscito a modificare questo codice per renderlo tale nè nessuno qui nel forum ha saputo aiutarmi qui

[WarriorXP]

Originariamente inviato da Mich_
Ho guardato il tuo sito, ma ha dei grossi problemi di visualizzazione. Ho usato Mozila 1.4 con una finestra del browser di circa 800x600

La pagina traborda la finestra sia a destra che a sinistra.
A destra si puo` vedere la fine mediante lo scrolling orizzontale, a sinistra no. Lo scrolling non funziona.

Anche la scritta nel primo riquadro a sinistra in alto esce dal riquadro (verso il basso): evidentemente anche qui usi dimensioni fisse, e non ti adegui alle dimensioni della scritta.

Ho dato un'occhiata al codice CSS, ed ho notato che usi dimensioni fisse per i div. Questo chiaramente limita molto l'usabilita` ed e` vietato dalle norme di accessibilita`.

Per come la vedo io, dovresti rivedere il progetto, usando solo dimensioni relative (% , em e simili). Un sito cosi` e` inutilizzabie dal mio punto di vista.

Ciao
Michele

Adesso secondo te può andare bene?? Ho messo la scelta per la risoluzione

[Jerry Masslo]

ma che indentazione stai usando? comunque per il problema del testo che si sposta su opera proverei a semplificare i div annidati, tu hai:


<div id="principale">
<div id="canali">


<div class="content"><div class="colonna">

<div class="intestazioni">

e nei css


#canali .content {
width: 570px;
}

#canali {
float: right;
padding: 10px;
border-left: 19px solid #F90;
background: #f0f0f0;
color: #000;
font: 10px verdana,sans-serif;
}
#canali .content .colonna {
float: left;
}



per cui magari tra float right e float left opera si confonde avrei pure provato a fare qualche modifica ma il problema va e viene e in locale non me lo fa ed è difficile così.

[Mich_]

Originariamente inviato da WarriorXP
Adesso secondo te può andare bene?? Ho messo la scelta per la risoluzione

La scelta per la risoluzione e` una cosa che non mi piace.
1. perche` comunque appena si apre la pagina e` visualizzata male;
2. perche` in caso di cambio devi ricaricare la pagina (e non e` detto che funzioni: in qualche caso viene ricaricata dalla cache.
Piuttosto fai la scelta della risoluzione prima di caricare il CSS.

Comunque la cosa non e` l'ideale.
Io uso uno schermo da 1280x1024 o superiore, e per questo posso permettermi di aprire le pagine in una finestra che e` circa 800x600 (mi permette di muovermi tra le finestre, e di lavorare in contemporanea su varie finestre: mentre una lavora (o scarica dati) io me guardo un'altra.
Quindi il tuo script fallirebbe.

Pero` dato che la risoluzione e` alta, i pixel sono piccoli, e devo ingrandire le dimensioni dei caratteri: per questo le scritte che tu inserisci nei box escono dal box (e ti diro` sta proprio male).

Inoltre la firma "All by Andrea Giannuzzi" si sovrappone esattamente al "Risoluzione usata", rendendo illeggibili ambedue (ho dovuto ricavare i testi qui sopra dal codice sorgente).

Le dimensioni verticali andrebbero lasciate libere, inserendo dove necessario dei div con clear:both per allineare i div successivi.

per quanto riguarda il testo, ora si legge tutto, per cui un bel passo avanti lo hai fatto.

Ciao
Michele

[WarriorXP]

Originariamente inviato da Mich_
La scelta per la risoluzione e` una cosa che non mi piace.
1. perche` comunque appena si apre la pagina e` visualizzata male;
2. perche` in caso di cambio devi ricaricare la pagina (e non e` detto che funzioni: in qualche caso viene ricaricata dalla cache.
Piuttosto fai la scelta della risoluzione prima di caricare il CSS.

Comunque la cosa non e` l'ideale.
Io uso uno schermo da 1280x1024 o superiore, e per questo posso permettermi di aprire le pagine in una finestra che e` circa 800x600 (mi permette di muovermi tra le finestre, e di lavorare in contemporanea su varie finestre: mentre una lavora (o scarica dati) io me guardo un'altra.
Quindi il tuo script fallirebbe.

Pero` dato che la risoluzione e` alta, i pixel sono piccoli, e devo ingrandire le dimensioni dei caratteri: per questo le scritte che tu inserisci nei box escono dal box (e ti diro` sta proprio male).

Inoltre la firma "All by Andrea Giannuzzi" si sovrappone esattamente al "Risoluzione usata", rendendo illeggibili ambedue (ho dovuto ricavare i testi qui sopra dal codice sorgente).

Le dimensioni verticali andrebbero lasciate libere, inserendo dove necessario dei div con clear:both per allineare i div successivi.

per quanto riguarda il testo, ora si legge tutto, per cui un bel passo avanti lo hai fatto.

Ciao
Michele

Non è che c'è un modo universalmente riconosciuto per sniffare la risoluzione?? Se si quale?

[Mich_]

Originariamente inviato da WarriorXP
Non è che c'è un modo universalmente riconosciuto per sniffare la risoluzione?? Se si quale?

Il modo per sniffare la risoluzione c'e` (non e` completamente corretto secondo XHTML, ma universalmente riconosciuto), ma non risolve il problema, come ti dicevo prima:
<head>
...
<script ...>
if(screen.width < 801) {
document.write('\<style type\=\"text\/css\"\> \@import url(style800\.css)\; \<\/style\>');
} else {
document.write('\<style type\=\"text\/css\"\> \@import url(style1024\.css); \<\/style\>');
}
</script>

Ciao
Michele