Visualizzazione dei risultati da 1 a 3 su 3
  1. #1

    Div dietro div per layout adattabile a varie risoluzioni



    Cerco di spiegarmi...

    Vorrei che nel sito si vedesse solo la parte blu per le risoluzioni <= 1280 x 1024... per chi invece utilizza una risoluzione più alta, vorrei che si vedesse anche il resto...

    In teoria:
    -il div sfondo (la parte bianca) dovrebbe avere width ed height a 100%
    -il div blu dovrebbe avere posizione relative e margin-left/margin-right impostati ad auto

    In pratica:
    non so come creare uno o più div esterni visibili solo con risoluzione alta / diminuendo lo zoom

    E' una cosa fattibile?

  2. #2
    Utente di HTML.it
    Registrato dal
    Sep 2001
    Messaggi
    21,188
    Mancano alcuni dati per poter definire tutti gli attributi necessari, comunque inizia con impostare:
    codice:
    HTML:
    <html>
    ...
    <body>
      <div id="wrapper">
        
    
    qui deve starci sempre qualcosa </p>
      </div> 
    </body>
    </html>
    
    CSS:
    html, body {
      width: 100%;
      min-height: 100%;
    }
    #wrapper {
      width: 1280px;
      max-wdth: 100%;
      margin: 0 auto;
      border: solid green 35px;  /* forse non lo vuoi in alto, ma io l'ho messo - nel caso occorre giocare con il border-width */
      width: auto;                   /* da verificare - forse non serve */
    }
    Non ho limitato in altezza; si puo` fare, ma occorre conoscere cosa ci andra` dentro queste cornici, per sapere se sara` piu` alto del 100% (se si limita al 100%, poi non funziona piu` lo scrolling).

    Nota: in IE dovrebbe funzionare se utilizzi una DTD strict, sicuramente hai problemi con DTD vecchie o transitional.
    Nuova politica di maggiore severita` sui titoli delle discussioni: (ri)leggete il regolamento
    No domande tecniche in messaggi privati

  3. #3
    Mi sa che mi sono spiegato male... il div blu e il div verde nel sito hanno delle immagini di sfondo...

    Sono riuscito a realizzare ciò che volevo fare, più o meno...

    codice:
    #sfondo{
     background-color: #000;
     width: 100%;
     height: 100%;
     position: absolute;
     z-index: -6;
     }
    
    
    #layout_est{
     position: relative;
     width:    1350px;
     height:1060px;
     margin-left:auto;
     margin-right:auto;
     top:-1024px;
     z-index: -4;
     background-image: url("../images/des_back.png");
    }
    
    #layout_int
    {
     position: relative;
     margin-top:-5px;
     margin-left:auto;
     margin-right:auto;
     width: 1279px;
     height: 1024px;
     z-index: -3;
     background-image: url("../images/des_nc.jpg");
    }
    
    body {
    overflow:hidden;
    }
    Risultato: con risoluzioni oltre i 1280 x 1024 compare il div layout_est...
    NOTA: non si può scorrere la pagina, quindi le risoluzioni più basse non potranno visualizzare correttamente il sito

    Conclusione: rifarò il design... magari già predisposto per le risoluzioni alte...

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 © 2026 vBulletin Solutions, Inc. All rights reserved.