Testo responsive

[manuela77]

Buon pomeriggio!!!!
Vi scirvo perchè avrei qualche problemino con la disposizione del testo all'interno dell'articolo in modo che sia responsive e quindi si ridimensioni al restringemento della finestra del browser.
Vorrei disporre il testo sotto all'immagine (che è centrata), lasciando un po' di margine a sinistra (160 px) e lo stesso margine a destra (quindi il testo non deve occupare l'intera larghezza della pagina, ma diciamo dovrebbe essere centrato), con l'allineamento justify.

1) Ho inserito il codice che riporto sotto e il testo viene inserito come vorrei, ma non è responsive, e dal cellulare (ma anche restringendo la finestra del browser) se ne vede solo la prima metà a sinistra, che è preceduta dal margine.

<div style="position: relative; left: 160px; top: 5px; width: 800px; height: 500px; z-index: 2; text-align: justify;">

2) Ho  provato anche ad impostare l'allinemaneto centrale + l'allineamento  Justify con questo codice, ma il testo viene spostato a sinistra e non è comunque responsive.

<div style="position: relative; width: 800px; height: 500px; z-index: 2; text-align: justify;" align="center">

Questo è il link al mio sito http://www.falegnameriaceria.provahosting.it/ct-menu-item-9/mensole.html

Spero ci sia qualcuno che abbia voglia di dedicarmi due minuti del suo tempo per darmi una mano... penso sia una domanda piuttosto banale, ma per me è di vitale importanza, perchè sono bloccata, non riuscendo  ad impaginare gli articoli
Grazie mille in anticipo per la vostra disponibilità:)
Manuela

[giusebos]

è sbagliato l'approccio con gli stili in linea che impongono quel comportamento.
nella textarea non dovrebbero mai esserci stili che vanno al di la di un "grassetto", di una lista ordinata/numerata, qualche break e le intestazioni.

[manuela77]

giusebos ti ringrazio per la tua gentile risposta!! Perdonami ma...quindi...quale potrebbe essere la soluzione?

[giusebos]

inizia ad eliniare tutto lo stile in linea e poi analiziamo il risultato con firebug, sicuramente qualche regola css va aggiustata

[manuela77]

Credo di aver eliminato lo stile. Ho provato ad aprire il sito con firebug...ma non saprei dove mettere le mani!!!!!!!!!!!!!!
Nel frattempo ho iniziato a leggermi una guida sull'uso dei CSS e ho capito cosa coso i fogli in linea e quanto sia molto più sensato andare a definire diciamo "l'impaginazione" delle pagine sui fogli esterni, senza dover tra l'altro riscrivere lo stile all'interno di ogni articolo. Adesso mi chiedo se riuscirò mai a capire come funzionano i css e a modificarli per le mie esigenze....

[giusebos]

c'è rimasto ancora qualcosa, disabilita l'editor ed elimina a mano quanto non serve come paragrafi vuoti e span

[manuela77]

Spero di aver tolto tutto e ho disabilitato l'editor.... attendo tue istruzioni e....grazie per la tua disponibilità

[giusebos]

no, ci sono ancora un sacco di refusi.

Ad editor disattivato devi avere una cosa pulita così

Codice: [Seleziona]

<div>
<img src="/images/CAT_WOOD_DESIGN/mensola_1.jpg" alt="testo">
</div>
<p>XXXXXXXXXXXXXXXXXXXLe mensole a parete rappresentano la soluzione ideale per appartamenti e abitazioni di piccole dimensioni: non occupano lo spazio del pavimento e consentono al micio di arrampicarsi in alto, esplorando lo spazio verticale. E' possibile creare una vera e propria parete attrezzata, disponendo a piacere le mensole che verranno utilizzate dal nostro gatto come scalini su cui arrampicarsi. </p>
<h3>CARATTERISTICHE<h3>
<ul>
<li>
decorate con un inserto in corda naturale che ne definisce il bordo;</span>
</li>
<li>
realizzate in multistrato di betulla e verniciate con due mani di impregnante all'acqua (atossico e privo di solventi), trasparente o colorato;
</li>
<li>
prive di staffe e viti a vista;
</li>
<li>
montate direttamente alla parete grazie a speciali tasselli che ne assicurano un ancoraggio ed una tenuta perfetti;
</li>
<li>
molto robuste: possono essere "scalate" anche dai gatti di grossa taglia (supportano fino a 20 Kg);
</li>
<li>
fornite di tasselli, viti, tappi copriviti e di semplici istruzioni che facilitano le operazioni di montaggio.
</li>
</ul>
se vedi il codice c'è molto di più di quello che deve esserci e questo creerà problemi

[giusebos]

c'è anche un ulteriore immagine di cui bisognerebbe capire il flusso e la coerenza...insomma dove deve stare se ci deve stare...se posso darti un consiglio un ulteriore immagine a latere rompe la geometria.....poi uno naturalmente fa come crede

[manuela77]

Scusa, pensavo di aver tolto tutto.
L'immagine deve stare a destra dell'elenco puntato. Sotto vorrei mettere altri 2  blocchi formati da testo con un'immagine laterale a destra, proprio per non lasciare solo testo nella pagina

[giusebos]

io adesso devo chiude, ma tu unserisci tutto il resto che dovrebbe starci che domani ti do ulteriori istruzioni

[manuela77]

Grazie davvero Giuseppe. Allora stasera inserisco tutto e ci risentiamo domani.
buona serata 😊😊😊

[giusebos]

Stavo guardando che nel menù in lto hai la parola prodotti, quindi prima di andare avanti mi chiedevo se avessi da fare diverse pagine con questa "impronta".

[manuela77]

si esatto, devo fare parecchie  pagine uguali.
Praticamente sto rifacendo in joomla 3  il sito che attualente è pubblicato nella vecchia versione 1.5:  www.falegnameriaceria.it
E vorrei impaginare gli articoli come in questa pagina http://www.falegnameriaceria.it/cat-wood-design/mensole.html

[giusebos]

Allora ho avuto il sentore giusto! ma tante quante?
Se sono molte pagine/articoli, gestirle solo con l'html è sconveniente, dovrai fare attenzione al codice di tutte le pagine e stare attenta che sia coerente.....un gran lavoro.

Secondo me converrebbe usare una estensione specifica, ad esempio un e-commerce dove puoi disabilitare la parte carrello/pagamento e diverrebbe un catalogo perfettamente impaginato e coerenete con le altre pagine/articoli

[manuela77]

Sono 11 pagine... Sinceramente non avevo pensato a questa possibilità... però se qui ho poche conoscenze, per un'estensione ecommerce le conoscenze sono zero.... non so... secondo sarebbe più semplice?

Io pensavo di creare una pgina in modo che funzioni tutto perfettamente, e poi duplicarla andando a variare testo ed immagini

[giusebos]

se mi avessi detto sono 1 max 2 pagine mi avresti convinto a continuare nella stessa strada, ma se ne hai di più ti consiglio davvero di usare qualcosa di specifico.

Installare e configurare al minimo una estenzione di e-commerce come virtuemart non è difficile, eventualmente il difficile è la parte che a te non serve, carrello/pagamenti/spedizioni.

Io proverei ed i vantaggi sono moltissimi:

Con l'html dovremmo ricreare un minimo di "schema" dove inserirci i contenuti, foto, liste e testi, fare attenzione che il tutto sia responsive e se poi si fa una modifica bisogna fare attenzione a non toccare qualcosa che ne potrebbe compromettere il risultato. Inoltre dovremmo scrivere delle regole specifiche nel file css......un bel pò di lavoro rispetto alla semplice installazione ed ad una minima configurazione.

[manuela77]

Ok, d'accordo. Ci provo!!!
Per ora ti ringrazio moltissimo per  tutti i consigli e per il tempo che mi ha dedicato

[giusebos]

prego, vedrai che non è così difficile, e qui nel forum se installerai virtuemart, troverai degli utenti espertissimi su questa estensione.

[manuela77]

perfetto!!!! Ci risentiamo presto