Navigazione

    Privacy - Termini e condizioni
    © 2020 Search On Media Group S.r.l.
    • Registrati
    • Accedi
    • CATEGORIES
    • Discussioni
    • Non letti
    • Recenti
    • Hashtags
    • Popolare
    • Utenti
    • Stream
    • Interest
    • Categories
    1. Home
    2. Categorie
    3. Coding e Sistemistica
    4. Coding
    5. Problema cocciuto con una lista!
    Questa discussione è stata cancellata. Solo gli utenti con diritti di gestione possono vederla.
    • O
      onsitus Super User • ultima modifica di

      Personalemente l'unica differenza che vedo tra le 2 pagine (con IE7 su windows) è che c'è più spazio tra la fine del menu e la parte inferiore della pagina. :bho:

      0 Miglior Risposta Ringrazia Cita Rispondi

        1 Risposta Ultima Risposta
      • V
        vale76 Bannato User Attivo • ultima modifica di

        no, no, c'è uno spazio di troppo tra il banner titolo e il menu dei poeti. come se ci fosse un <br> 😞

        0 Miglior Risposta Ringrazia Cita Rispondi

          1 Risposta Ultima Risposta
        • V
          vale76 Bannato User Attivo • ultima modifica di

          ragazzi, perdonatemi tanto, ma dopo aver fatto altre prove e vari pasticci inimmaginabili, sono riuscita a ripristinare la situazione di partenza.. ma senza ottenere l'effetto che vorrei..
          ricapitoliamo; la pagina sulla quale sto lavorando è [url=http://www.paroledautore.net/villa_indice3.htm]questa.

          Come vedete, c'è il menu di navigazione, in alto, su due linee orizzonali. Sotto, la lista di link, che sono i titoli delle poesie dell'autore, questa volta, una normale lista con i links in verticale.

          Per ottenere questa situazione, nel CSS collegato, per il menu superiore, orizzontale, questa dichiarazione:

          
          div.navigazione li{
          list-style-type:none;
          padding:2px;
          margin:0;
          margin-left:2px;
          margin-right:4px;
          display:inline;
          }
          
          

          e richiamato così nella pagina:

          <div class="navigazione">
           <ul>
               <li><a href></li>
               <li><a href></li>
           </ul>
          </div>
          

          (ho usato una class, anche se inizialmente era un #id, per poterla ripetere, infatti le righe sono due).

          Per il menù titoli delle poesie verticali:

          
          div#menu_titoli li{
          	list-style:square inside;					
          	padding: 5px;
          	margin-left:40px;
          	margin-right:90px;
          	margin-bottom: 5px;
          	}
          
          

          e così richiamato nella pagina:

          
          <div id="menu_titoli">
           <ul>
                <li><a href></li>
                <li><a href></li>
           </ul>
          </div>
          
          

          La mia richiesta; premessa: non visualizzate la pagina con il solito IE, in quanto non mostra la pagina come su Firefox e Opera, per quanto riguarda il menu di navigazione orizzontale in alto, infatti, con queste impostazioni non sono riuscita in nessun modo a eliminare lo spazio visivo tra il banner pagina "poesie amatoriali" e il menu.

          Qualche anima pia può aiutarmi? 😞

          0 Miglior Risposta Ringrazia Cita Rispondi

            1 Risposta Ultima Risposta
          • O
            onsitus Super User • ultima modifica di

            [HTML]
            div.navigazione ul{
            margin:0;
            padding:0;
            }
            [/HTML]

            0 Miglior Risposta Ringrazia Cita Rispondi

              1 Risposta Ultima Risposta
            • V
              vale76 Bannato User Attivo • ultima modifica di

              ora è salita, ma nn c'è più distanza tra le due righe!

              http://www.paroledautore.net/villa_indice3.htm

              😢

              0 Miglior Risposta Ringrazia Cita Rispondi

                1 Risposta Ultima Risposta
              • O
                onsitus Super User • ultima modifica di

                @Vale76 said:

                ora è salita, ma nn c'è più distanza tra le due righe!

                http://www.paroledautore.net/villa_indice3.htm

                😢

                Eh si. Le due righe sono due div differente con il stesso nome di classe. 🙂

                0 Miglior Risposta Ringrazia Cita Rispondi

                  1 Risposta Ultima Risposta
                • V
                  vale76 Bannato User Attivo • ultima modifica di

                  Se agisco su margin-bottom è corretto, o devo dare alle due righe due classi diverse? Perché sto provando con il bottom e si stanno distanziando.

                  0 Miglior Risposta Ringrazia Cita Rispondi

                    1 Risposta Ultima Risposta
                  • O
                    onsitus Super User • ultima modifica di

                    A quel punto, prova a metterci semplicemente:
                    margin-top: 0;

                    😉

                    0 Miglior Risposta Ringrazia Cita Rispondi

                      1 Risposta Ultima Risposta
                    • V
                      vale76 Bannato User Attivo • ultima modifica di

                      @Onsitus said:

                      A quel punto, prova a metterci semplicemente:
                      margin-top: 0;

                      😉

                      no, non va bene, non c'è spazio tra le due righe, e appaiono soffocate, vedi:

                      http://www.paroledautore.net/villa_indice3.htm

                      0 Miglior Risposta Ringrazia Cita Rispondi

                        1 Risposta Ultima Risposta
                      • O
                        onsitus Super User • ultima modifica di

                        @Vale76 said:

                        no, non va bene, non c'è spazio tra le due righe, e appaiono soffocate, vedi:

                        http://www.paroledautore.net/villa_indice3.htm

                        Dal tuo css:

                        [HTML]
                        div.navigazione ul{
                        margin:0;
                        padding:0;
                        margin-top:0;
                        }

                        [/HTML]

                        Serve togliere il margin:0;

                        0 Miglior Risposta Ringrazia Cita Rispondi

                          1 Risposta Ultima Risposta
                        • V
                          vale76 Bannato User Attivo • ultima modifica di

                          è quello che ho fatto, ma insisto, non c'è distanza tra la riga sopra e la riga sotto.

                          0 Miglior Risposta Ringrazia Cita Rispondi

                            1 Risposta Ultima Risposta
                          • V
                            vale76 Bannato User Attivo • ultima modifica di

                            errata corrige, non avevo tolto il margin 0, ora funziona, grazie 🙂

                            0 Miglior Risposta Ringrazia Cita Rispondi

                              1 Risposta Ultima Risposta
                            • O
                              onsitus Super User • ultima modifica di

                              Ok, stavo per postarti un screenshot.:D

                              0 Miglior Risposta Ringrazia Cita Rispondi

                                1 Risposta Ultima Risposta
                              • V
                                vale76 Bannato User Attivo • ultima modifica di

                                @Onsitus said:

                                Ok, stavo per postarti un screenshot.:D

                                ehm, visto che sei così gentile, ti faccio vedere un'altra prova ghgh :D:

                                http://www.paroledautore.net/villa_indice4.htm

                                ho realizzato l'opposto della pagina precedente, ho ottenuto tre colonne seguendo un esempio reperito da html.it
                                però non riesco ancora a metterlo a punto: se invece di tre colonne, volessi vederne due?

                                nel css:

                                ul#multi,ul#multi li{margin:0;padding:0;list-style:square inside;}
                                
                                ul#multi{width: 100%;overflow: hidden;
                                    padding: 1em 0;margin:4em 0;
                                    line-height: 1.8;
                                    }
                                
                                ul#multi li{float: left;width: 32%;
                                    margin-left: 1%;display: inline;
                                    border-bottom:1px dotted #777}
                                

                                nella pagina:

                                [HTML]<ul id="multi">
                                <li>Elemento di lista 1</li>
                                <li>Elemento di lista 2</li>
                                </ul>[/HTML]

                                inoltre, così facendo non si vede più il quadratino, come mai?

                                0 Miglior Risposta Ringrazia Cita Rispondi

                                  1 Risposta Ultima Risposta
                                • O
                                  onsitus Super User • ultima modifica di

                                  Riguardo le due colonne, in ul#multi li, c'e width: 32%;. Sarebbe l'equivalente di un terzo di ul impostato a 100%. Cambia il valore di 32% per 50% (o leggermente di meno 48/49 - fa qualche prove)

                                  Riguardo le bullet (il quadratino), quello e piu difficile da spiegare.
                                  Se toglie il display:inline; le bullet saranno visibile in Firefox ma non per Internet Explorer che interpreta la larghezza del ul senza includere il spazio necessario per il quadratino. Per quello viene tagliato fuori (non e visibile). Il primo problema potrebbe il text-align centrato ma anche se lo imposta a sinistra, sara cmq da aggiungere un padding-left a ul per dare spazio al quadratino erenderlo visibile. Anche facendo cosi, incontra quello che potrebbe essere il secondo problema con il float left. Di nuovo, IE spostera il testo (li) completamente a sinistra senza prendere in conto il quadratino. Va be, io mi capisco. La soluzione non c'e l'ho (non cosi senza fare prove).:D
                                  Se vuoi capire quello che volevo dire, puoi dare un occhiata a questo articolo:
                                  http://www.onsitus.it/index.php?option=com_content&task=view&id=43&Itemid=54
                                  Era per un altro tipo di bug ma pure in quel caso i quadratini spariscono e puoi vedere la differenza di interpretazione del elemento ul tra Firefox e IE.;)

                                  0 Miglior Risposta Ringrazia Cita Rispondi

                                    1 Risposta Ultima Risposta
                                  • V
                                    vale76 Bannato User Attivo • ultima modifica di

                                    ma è difficile combattere con queste maledette liste! mi stanno facendo impazzire, ho fatto senza accorgermi un errore di parsing nel CSS e a momenti mi pigliava un colpo! :rollo:

                                    @Onsitus, sono stufa di combattere, è da stamattina che continuo. Lascio così a tre colonne, ma non riesco al solito a farle salire uffaaaaaaa

                                    
                                    ul#multi,ul#multi li{margin:0;padding:0;list-style:none}			
                                    
                                    ul#multi{width: 100%;overflow: hidden;
                                        padding: 1em 0;margin:4em 0;
                                        line-height: 1.8;
                                        }
                                    
                                    ul#multi li{float: left;width: 32%;
                                        margin-left: 1%;display: inline;
                                        border-bottom:1px dotted #777}
                                    
                                    

                                    margin-top o margin:0, non ci sto capendo più niente, dove lo devo mettere?

                                    http://www.paroledautore.net/villa_indice4.htm

                                    0 Miglior Risposta Ringrazia Cita Rispondi

                                      1 Risposta Ultima Risposta
                                    • V
                                      vale76 Bannato User Attivo • ultima modifica di

                                      forse ho risoltoooooooooooo
                                      ho cambiato, ho messo la dichiarazione dentro a un div li e un div ul e pare anche che non ci siano errori, ma se qualcuno gentilmente potesse controllare per dirmi se va bene, così posso andare avanti a lavorare al mio sito... chiedo scusa ancora per il continuo disturbo.. :imb:

                                      questa la doppia dichiarazione nel CSS:

                                      
                                      div.multicolonna li{
                                      margin:0;padding:0;list-style:none;
                                      float:left;width:32%;
                                      margin-left: 1%;display: inline;
                                      border-bottom:1px dotted #777}
                                      
                                      div.multicolonna ul{
                                      width: 100%;overflow: hidden;
                                      padding: 1em 0;margin:4em 0;
                                      line-height: 1.8;
                                      margin-top:0;
                                      }
                                      
                                      

                                      questa la pagina: http://www.paroledautore.net/villa_indice4.htm

                                      grazie in anticipo 🙂

                                      0 Miglior Risposta Ringrazia Cita Rispondi

                                        1 Risposta Ultima Risposta
                                      Caricamento altri post
                                      Rispondi
                                      • Topic risposta
                                      Effettua l'accesso per rispondere
                                      • Da Vecchi a Nuovi
                                      • Da Nuovi a Vecchi
                                      • Più Voti