Visualizzazione dei risultati da 1 a 6 su 6

Discussione: Div sulla stessa riga responsive

  1. #1

    Div sulla stessa riga responsive

    Salve raga, sono riuscito a mettere uno affianco all altro due div. L unico problema che non sono responsive. https://www.booking-lagodigarda.it/recensioni.php

    codice:
    .left{  width: 20%;
      float: left;
      
    }
    
    .right{
        
        float: left;
        width:80%;
       /* margin-top: 6px;
        margin-bottom: 30px;*/
    
    }
    Questo è il css di ognuna delle recensioni. L HTML lo potete controllare con Ispeziona Elemento di Chrome. Cosa devo aggiungere

  2. #2
    Utente di HTML.it L'avatar di m4rko80
    Registrato dal
    Aug 2008
    residenza
    Milano
    Messaggi
    2,534
    Ciao , da quel che vedo c'è un errore (probabilmente generato dalla costruzione con un ciclo da PHP o altro).
    I div WRAP sono i blocchi per ogni recensione e i div LEFT / RIGHT i relativi 2 contenitori.
    Se guardi il sorgente ogni successivo WRAP è annidato dopo ogni RIGHT mentre andrebbe chiuso il WRAP e aperto un nuovo.
    Il fatto che poi non sia responsive è intanto dipeso da questo, se poi si tratterà anche di dimensioni ovviamente dovri gestire con le media query le dimensioni di LEFT E RIGHT o modificare il tipo di layout appunto in base alle media query.

  3. #3
    Quote Originariamente inviata da m4rko80 Visualizza il messaggio
    Ciao , da quel che vedo c'è un errore (probabilmente generato dalla costruzione con un ciclo da PHP o altro).
    I div WRAP sono i blocchi per ogni recensione e i div LEFT / RIGHT i relativi 2 contenitori.
    Se guardi il sorgente ogni successivo WRAP è annidato dopo ogni RIGHT mentre andrebbe chiuso il WRAP e aperto un nuovo.
    Il fatto che poi non sia responsive è intanto dipeso da questo, se poi si tratterà anche di dimensioni ovviamente dovri gestire con le media query le dimensioni di LEFT E RIGHT o modificare il tipo di layout appunto in base alle media query.
    Ora sono chiusi bene i div, ma da sempre lo stesso problema

  4. #4
    Utente di HTML.it L'avatar di m4rko80
    Registrato dal
    Aug 2008
    residenza
    Milano
    Messaggi
    2,534
    Io contenitore di per se è resonsive ma tutto il sito lo deve essere ovviamente. Per esempio il tuo .container che wrappa a sua volta ha una width fissa di 960px. Se questa è fissa, su mobile quando non avrai 960 ma meno, avrai per forza di cose un efffetto di scroll orizzontale. Presumo vadano sistemate diverse cose per avere tutto responsive.
    Se ad esempio metto un max-width:960px al posto di widt:960px puoi già farti un'idea di come cambia.

  5. #5
    Ho inserito max-width ma non è cambiato niente. Per quanto riguarda le media query potresti scrivermele che le vado ad incollare sul CSS

  6. #6
    Utente di HTML.it L'avatar di m4rko80
    Registrato dal
    Aug 2008
    residenza
    Milano
    Messaggi
    2,534
    Consigliarti riga per riga è piuttosto difficile. Nel tuo css ci sono già implementate le media query da quel che vedo tipo in skeleton.css riga 208. Anche provando a modificare al volo ci sono troppe regole da editare per far quadrate tutto. La cosa migliore è metterti li a ispezionare il css dalla console e modificare man mano le parti interessate.
    Da quel che noto ora però, viene incluso bootstrap. Mi chiedo perchè non viene usato il suo sistema nativo di griglie il quale risolverebbe tutto dato che è repsonsive come si deve (griglia ed elementi vari).
    https://getbootstrap.com/docs/3.3/getting-started/
    https://getbootstrap.com/docs/3.3/css/#grid
    https://getbootstrap.com/docs/3.3/css/#forms

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2018 vBulletin Solutions, Inc. All rights reserved.