Back to top

Autore Topic: [RISOLTO] Rendere modulo custom con immagini responsivo (dovrebbe esserlo già)  (Letto 1503 volte)

Offline cloud7-2

  • Nuovo arrivato
  • *
  • Post: 25
    • Mostra profilo
Ciao ragazzi!
Premetto che utilizzo Purity 3 con t3 framework.
Ho un modulo custom, che contiene 8 piccole icone (in riga, una distanziata dall'altra da qualche colpo di barra spaziatrice)

Se allargo lo zoom o visualizzo il sito da smartphone la riga si spezza, ho le prime 4 icone in una riga, le altre 4 a capo ma sfalsate

Cosa posso fare per fare in modo che le icone in 1 vengano mostrate tutte in una riga ed il banner rispetti le dimensioni della pagina senza allargarla?
Grazie in anticipo  :D
« Ultima modifica: 31 Dic 2017, 11:42:10 da cloud7-2 »

Offline tomtomeight

  • Global Moderator
  • Fuori controllo
  • ********
  • Post: 32046
  • Sesso: Maschio
  • Gli automatismi aiutano ma non insegnano nulla.
    • Mostra profilo
Non è il modulo che devi rendere responsive ma il suo contenuto. Dipende dal codice che ci metti.

Offline cloud7-2

  • Nuovo arrivato
  • *
  • Post: 25
    • Mostra profilo
Che tag posso mettere per rendere tutto in linea anche in schermi più piccoli?

Offline cloud7-2

  • Nuovo arrivato
  • *
  • Post: 25
    • Mostra profilo
Ho risolto inserendo una tabella "responsive", del tipo:


Codice: [Seleziona]
<div class="table-responsive">
    <table>
        <thead>
            <tr>
                <th>immagine 1</th>
                <th>immagine 2</th>
                <th>immagine 3</th>
                <th>immagine 4</th>
                <th>immagine 5</th>
                <th>immagine 6</th>
                <th>immagine 7</th>
                <th>immagine 8</th>
            </tr>
        </thead>
    </table>
 </ div>


(togliete lo spazio dopo "/ div", non so perché ma l'editor del forum se lo tolgo non visualizza più la riga  :P  )
Per richiamare lo stile responsivo basta andare nel custom.css del proprio template (se non esiste basta crearlo) ed inserire:


Codice: [Seleziona]
.table-responsive {
width: 100%;
}

Offline giusebos

  • Fuori controllo
  • *
  • Post: 21748
  • Sesso: Maschio
  • Giuseppe Serbelloni Mazzanti Viendalmare
    • Mostra profilo
bastava solo il css che hai proposto con la classe del modulo.....le tabelle sono deprecate per le immagini.
su www.icagenda.it guide e tutorial con esempi di chronoforms e chronoconnectivity

Offline cloud7-2

  • Nuovo arrivato
  • *
  • Post: 25
    • Mostra profilo
Grazie per la dritta! Sai per caso dove posso trovare le classi di ogni tipo di modulo Joomla?
Esiste una lista che consenta di evitare un'ispezione del css?

Offline giusebos

  • Fuori controllo
  • *
  • Post: 21748
  • Sesso: Maschio
  • Giuseppe Serbelloni Mazzanti Viendalmare
    • Mostra profilo
scusa ma non capisco la domanda
su www.icagenda.it guide e tutorial con esempi di chronoforms e chronoconnectivity

Offline cloud7-2

  • Nuovo arrivato
  • *
  • Post: 25
    • Mostra profilo
Mi sono spiegato male.
Vorrei sapere come il css di Joomla chiama le varie tipologie di modulo (custom, contatti, ecc.), in modo tale da modificare il css direttamente sul modulo e non sul contenuto.

Offline giusebos

  • Fuori controllo
  • *
  • Post: 21748
  • Sesso: Maschio
  • Giuseppe Serbelloni Mazzanti Viendalmare
    • Mostra profilo
le classi abbinate ad un modulo o parte di sito sono visibili con la funzione "analizza elemento" del browser o con firebug.
su www.icagenda.it guide e tutorial con esempi di chronoforms e chronoconnectivity

Offline cloud7-2

  • Nuovo arrivato
  • *
  • Post: 25
    • Mostra profilo

 



Web Design Bolzano Kreatif