Indentare secondo rigo del menu

[angelaca2]

Ciao.
Ho il menu principale sulla sinistra con delle iconcine. Vorrei però che quando il testo va sul secondo rigo, il testo avesse un'indentatura. Cerco di spiegarmi meglio...
---
|img| testo menu che
va a capo
---
|img| testo menu che
          va a capo
---


grazie
angela

[giusebos]

Per Indentare solo la prima riga del paragrafo devi agire sui css utilizzando la proprietà text-indent.

La proprietà è molto semplice da utilizzare, prende in ingresso un valore (in pixel, ems, etc) corrispondente al rientro desiderato. Un esempio di utilizzo è il seguente:

Codice: [Seleziona]

p { text-indent: 15px; }

[angelaca2]

Dici che potrei indentare al negativo la.prima riga e poi spostare il posizionamemto di tutto il menu più a destra? 
L'idea è simpatica... ora non ho il comp per le mani.  Appena provo ti faccio sapere.
grazie
ang

[giusebos]

devi provare, sopratutto a visualizzare l'articolo con altri device.

ma se lo scopo è quello di avere la prima riga cosi:



Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut a eros id sem hendrerit ornare eget vel sem.
          Mauris consectetur sit amet erat at dignissim.
          Quisque aliquet non nibh sit amet pharetra. Nulla facilisi. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis.
          Curabitur pretium porta convallis. Donec dapibus viverra ultrices. Proin ornare ligula id accumsan pellentesque.
          Aenean euismod turpis quis sem consectetur, quis tincidunt justo pretium.


meglio usare una classe specifica

[angelaca2]

Scusami Giusebos ma non parlo di articolo bensì di voci menu. E lo scopo è ottonere u'nindentatura non della prima riga ma della seconda riga quando il testo della voce menu è più lungo e a causa della presenza dell'icona risulta su due righe. Non mi piace proprio che si visualizzi cosi:
|__| vai a pagina
contatti
Cioè seconda riga sotto l'icona e non allineata al testo della prima riga.

Vorrei che si visualizzasse invece in questa maniera:
|__| vai a pagina
        contatti
come se ci fosse una tabella con due colonne.
Spero che si veda bene e di essere stata abbastanza vhiara stavolta.
:*

[giusebos]

hai ragione, chissà come ho fatto a capire che era per un paragrafo!!

per le voci di menù devi sempre agire nei css, ma questa volta devi individuare esattamente il div delle sottovoci e dare un margin-left oppure un padding-left.


Per queste operazioni ci si aiuta con uno strumento che si usa in firefox: firebug
Con questa estensione si individua dove esattamente bisogna intervenire con il codice, sia se il css è scritto, sia che questo sia da scrivere.

Puoi inserire le modifiche al volo e recuperare il codice da inserire nel tuo css.

C'è un video su come si usa questo strumento, girato proprio su un sito realizzato in joomla.
http://www.joomla.it/video-guide/3645-videotutorial-su-come-utilizzare-firebug-con-il-proprio-sito-joomla.html


devi anche avere qualche nozione di CSS, ma niente di particolarmente difficile:

cerca
css padding e margin

[angelaca2]

Si, quello lo so usare (da brava ladra di codici e funzioni varie). Tra l'altro ciò che ho fatto per imparare a conoscere (sto) joomla (un poco) è stato proprio smontare pezzo per pezzo il template e modificarlo a mio piacimento.
...
Potrei anche modificare il margine o il padding ma non sposterebbe tutto il testo compresa l'icona?  Domattina proverò a impostare il valore dell'indentatura in negativo (-10px ad esempio) in modo tale che mi venga più o meno così

Lorem ipsum dolor sit amet,
         consectetur adipiscing elit. Ut a
        eros id sem hendrerit
        ornare eget vel sem.
Mauris consectetur it amet
       erat at dignissim.

E poi sposto il margine a destra (+10px).
Provo e ti faccio sapere.
Se ruconosce il valore negativo una volta inserita l'icona,  dovrebbe funzionare.
:* :* :*
Ang

[giusebos]

forse va bene anche un margine negativo, ma poi controlla con le altre risoluzioni, quelle degli smartphone e tablet.

[angelaca2]

        

[giusebos]

 

[angelaca2]

E già così piango ma se mi ricordo del mio adorato software di grafica che non si usa più. .......
UNGHEEEEEEÈ!!!!!
(non mi far dire il nome va sennò mi viene mal di stomaco)

[giusebos]

ma no, è solo questione di abitudine, quello che facivi con il software lo fai a mano con più controllo

[angelaca2]

Si hai ragione tu come sempre... anche li devo rimettermi a studiare. Una cosa alla volta. Intanto la testa mi parte con mille cose carine ma non ho le mani (sono rientrata dopo una luuunga "pausa" da pochi mesi)... figurati che un piccolissimo banner l'ho dovuto fare con quel sftw di fotoritocco... dammi tempo che ti torturo anche lì.
Scusa sono OT ormai.

[tomtomeight]

Ma il testo del menu perché dovrebbe andare a capo, si parla di quando la voce e più lunga ma le voci non dovrebbero essere molto lunghe. Ci sono template che aggiungono delle descrizioni aggiuntive per le voci, forse dovresti utilizzare quelle.

[angelaca2]

Si giusto anche questo. Il problema si è posto in voci come: servizi alle famiglie; documenti online; bandi e concorsi...
  Aggiunta l'iconcina, l'ultima parola va a capo. E si visualizza in quella maniera che a me non piace. Ora, ho risolto momentaneamente allargando di qualche px lo spazio al menu, ma a me, fin dove posso, non piace sottostare ad un software e, sempre nell'ottica di imparare, volevo trovare la soluzione per impostare la pagina come IO voglio e NON come vuole LUI.
grazie mille veramente

[tomtomeight]

Non si tratta di come vuole il template o altro ma di come presentare nel migliore dei modi i contenuti e una voce su due righe nonè il massimo, di estetica, di fruibilita e di estetica. Poi ognuno fa come vuole.

[valpredina]

Si giusto anche questo. Il problema si è posto in voci come: servizi alle famiglie; documenti online; bandi e concorsi...
  Aggiunta l'iconcina, l'ultima parola va a capo. E si visualizza in quella maniera che a me non piace.

Ciao, sono un principiante anche io e ho avuto lo stesso problema, non con i menu ma con i paragrafi degli articoli ma la soluzione penso sia la stessa.
Se guardi l'allegato di questa risposta vedrai che in un caso sotto la stellina rossa il testo nella seconda linea è allineato con quello sopra mentre nell'altro no. Nel primo caso l'immagine è inserita con un margin-bottom di una ventina di px mentre nel secondo no. Il margin-bottom impedisce che il testo possa allinearsi a sinistra in quanto l'istruzione margin "spinge" per così dire verso destra il testo. Con i menù dovrebbe essere la stessa cosa ma dovrai agire forse sui css che controllano la visualizzazione dell'immagine nel menu a meno che tra le opzioni che ti fornisce il menu per le immagini non ci sia il parametro margin bottom.
Spero di essermi spiegato
Ciao

[angelaca2]

Bella questa idea! Non ho avuto proprio modo di lavorare su questa cosa oggi. Appena provo vi faccio sapere subito!
Grazie mille a tutti.
:*
ang