Visualizzazione risultati 1 fino 11 di 11
Like Tree1Likes
  • 1 Post By NLSweb

Discussione: Sovrapposizione dei contenuti dei div

  1. #1
    Guest

    Predefinito Sovrapposizione dei contenuti dei div

    Ciao a tutti,
    ho un dubbio dovuto all'ignoranza.

    Ho tre div, uno a fianco all'altro, che hanno una dimensione relativa. Ho settato una larghezza minima. Vorrei che i contenuti dei div non si sovrapponessero quando ridimensiono la pagina. Quale soluzione dovrei adottare? Grazie mille

  2. #2
    karl94 non è connesso Staff AV
    Data registrazione
    03-10-2005
    Messaggi
    17,744

    Predefinito

    Potresti indicare l'indirizzo della pagina in questione?

  3. #3
    Guest

    Predefinito

    Ecco, appena ho appena messo online le ultime modifiche.
    http://mousraw.altervista.org/index.html
    Ultima modifica di karl94 : 22-06-2014 alle ore 18.57.09 Motivo: Correzione URL

  4. #4
    NLSweb non è connesso Altervistiano Junior
    Data registrazione
    17-01-2014
    Messaggi
    658

    Predefinito

    vuoi di proposito che i div si ridemsionino in percentuale alla riduzione della finestra ?
    non desideri quindi che quando si riduca la pagina la si possa scorrere orizzontalmente ?

  5. #5
    Guest

    Predefinito

    Fino a un certo punto voglio che si ridimensionino(che ho imposto con min-width), però invece di sovrapporsi vorrei che si possa scorrere orizzontalmente

  6. #6
    NLSweb non è connesso Altervistiano Junior
    Data registrazione
    17-01-2014
    Messaggi
    658

    Predefinito

    hai impostato una position fixed e sia la dimensione che la posizione degli elementi in percentuale
    con questa impostazione e' inevitabile che si sovrappongono.

    ho cambi impostazione completamente , oppure devi usare i media query per cambiare gli stylesheet al ridimensionamento della pagina

    io ti consiglio ti non ridimensionare gli elementi , anche perche' il problema si pone a dimensioni inferiori a 1024px
    ed a meno che tu non voglia sviluppare il sito per schermi molto piccoli , non serve il ridimensionamento
    Ultima modifica di karl94 : 23-06-2014 alle ore 12.03.09
    karl94 likes this.

  7. #7
    Guest

    Predefinito

    Forse ciò che preferisco è cambiare il css nel caso in cui la dimensione della finestra non mi permetta il layout che preferisco.
    Ho visto su javascript quale è la funzione per avere le dimensioni attuali della finestra del browser, come mi consigliate di svilupparlo? Ho provato la soluzione di un controllo della dimensione ogni x tempo ma la soluzione non è né ottimale né funziona
    Grazie mille

  8. #8
    NLSweb non è connesso Altervistiano Junior
    Data registrazione
    17-01-2014
    Messaggi
    658

    Predefinito

    Puoi caricare gli stylesheet in base alla risposta del media query , esempio
    Codice:
    <link rel='stylesheet' media='screen and (min-width: 960px)' href='css/medium.css' />
    o integrarlo direttamente nel codice , esempio

    Codice:
    @media all and (min-width: 960px) {
      #elemento{
       .....
      }
    }
    quindi quando viene caricata la pagina la risposta dei media query usera' il foglio di stile appropriato

    nel caso in cui la finestra venga ridimensionata , puoi applicare un window.addEventListener per verificare l'evento resize
    e quindi riaggiornare i fogli di stile (questo se vuoi usare javascript)
    Ultima modifica di karl94 : 23-06-2014 alle ore 12.04.15 Motivo: Unione messaggi consecutivi

  9. #9
    Guest

    Predefinito

    Codice:
    window.addEventListener("resize", piccolo, true);
    
    function piccolo()
    {
    	if (window.innerWidth < 640) 
    	{
    	 	{document.writeln('<link rel="stylesheet" type="text/css" href="Versione mobile.css" />');}
    	}
    }
    Ho provato a usare questo codice javascript ma non mi funziona. Nella versione mobile del mio css dovrebbe cambiare semplicemente il colore del titolo in rosso in modo tale che veda subita se c'è stata una modifica. In cosa sbaglio? Il codice si trova nell'head dell'html

  10. #10
    karl94 non è connesso Staff AV
    Data registrazione
    03-10-2005
    Messaggi
    17,744

    Predefinito

    Ti consiglio di usare le Media Query, sono fatte appositamente per questo scopo. Segui gli esempi che ti ha proposto NLSweb.
    Molti browser per dispositivi mobili inoltre forzano la viewport ad una larghezza di 1024px, se vuoi ottimizzare il layout per dimensioni inferiore a questa non dimenticare di aggiungere l'elemento meta apposito.

  11. #11
    NLSweb non è connesso Altervistiano Junior
    Data registrazione
    17-01-2014
    Messaggi
    658

    Predefinito

    Il codice per controllare l'evento resize funziona , il codice per scrivere una nuova linea di codice no.

    le partesi graffe non servono document.writeln("....");

    ma non devi scrivere una nuova linea di codice per richiamare lo stylesheet !
    in quanto lo dichiari a monte come nell'esempio che del post precedente..

Regole di scrittura

  • Non puoi creare nuove discussioni
  • Non puoi rispondere ai messaggi
  • Non puoi inserire allegati.
  • Non puoi modificare i tuoi messaggi
  •