modulo personalizzato su due colonne responsive

[Quiz]

Ciao a tutti e grazie di esistere.
Seguo il forum e il sito da molto tempo e questo è il primo post che pubblico, ringrazio per il preziosissimo supporto.


Ho un piccolo quiz.


Un cliente mi ha chiesto di realizzare un sito semplice, sono partito con protostar, ora desidera qualcosa che non so proprio come far rientrare nel template se non creando un modulo nuovo. Allego uno screenshot della richiesta.


Abito in provincia di Milano e sono anche disponibile ad instaurare collaborazioni che prevedano un rimborso spese. In questo caso preferirei un contatto personale.


tutte le immagini sono singole, la struttura è stata copiata da quella di un ecommerce ma che per ora non svilupperemo.
la richiesta è quindi quella di  creare un modulo da pubblicare nelle varie pagine, tenendo la stessa impostazione.
Due foto una a fianco all'altra, di lunghezza e larghezza differente e alcune miniature pubblicate sotto la foto più corta.


Il tutto dovrebbe essere responsive.
Secondo te, che strada mi conviene percorrere?


Ciao, grazie per il tuo tempo.

[adottauncane]

Ciao Quiz,
benvenuto nel form.
Se ti serve una soluzione fai-da-te senza particolari necessità o funzioni, puoi semplicemnte usare un modulo html personalizzato inserendo una tabella fatta così (vedi codice che ti scrivo) con le foto al 100%.
Le celle della tabella vanno costruite in percentuale, quindi dovrai calcolare esattamente la misura delle foto in modo che il tutto risulti compatto.

Codice: [Seleziona]

<table border="0" style="width: 100%;" cellpadding="0">
    <tbody>
        <tr>
            <td colspan="3"><img src="images/banners/1.jpg" alt="1" width="100%" height="NaN" /></td>
            <td rowspan="2" width="44%"><img src="images/banners/5.jpg" alt="5" width="100%" height="NaN" style="float: left;" /></td>
        </tr>
        <tr>
            <td><img src="images/banners/2.jpg" alt="2" width="100%" height="NaN" /></td>
            <td><img src="images/banners/3.jpg" alt="3" width="100%" height="NaN" /></td>
            <td><img src="images/banners/4.jpg" alt="4" width="100%" height="NaN" /></td>
        </tr>
    </tbody>
</table>
Il risultato lo vedi qui:
http://www.piccoliwebmaster.com/
modulo prova.

Le foto le ho tagliate in fretta, ma se fai un lavoro accurato rimane tutto perfetto.

Tieni le foto abbastanza grandi in modo che non si sgranino quando stringendo il modulo si allarga.
Varia la percentuale della cella come ti serve.

[adottauncane]

Naturalmente puoi poi collegare ogni immagine come un link...

[Quiz]

Ciao,
grazie per la risposta, provo appena possibile a mettere in pratica il suggerimento.
Come posso fare per entrare in contatto con te?

[adottauncane]

Scrivi qui sul post o mi mandi un PM...

[Quiz]

Ciao, ho provato ad utilizzare la tua soluzione. È  sicuramente valida ma avrei bisogno che fosse responsive. Cioè avrei bisogno che visualizzando su smartphone, le immagini si dispongano su una colonna.
Ho trovato l'esempio su un ecommerce. Non so se posso inserire il link.

[adottauncane]

Puoi mettere l'esempio ma ho capito.
Solo che con un modulo html non saprei cosa suggerirti.
Se inserisci le immagini con l'editor e il float-left andrebbero su una colonna, solo che non puoi incastrarle come chiedi...

[Quiz]

ok, non inserisco il link così evito anche inutile pubblicità.
A parte il modulo, cosa suggeriresti per avere una soluzione utilizzabile e posizionabile nelle varie pagine del sito.


Qual'è la strada più professionale ed efficace da seguire?


Grazie ne!