Pagina 1 di 3 1 2 3 ultimoultimo
Visualizzazione dei risultati da 1 a 10 su 22

Discussione: css layout

  1. #1
    Utente di HTML.it
    Registrato dal
    Dec 2004
    Messaggi
    16

    css layout

    Salve volevo chiedere come posso fare per realizzare un' layout tableless in qs modo. Allora: div "container", dentro "header", sotto "menu" e "contenuto" (menu a destra o a sinistra) e "footer"

    Caratteristiche: con percentuali per es container 90% dello schermo altezza e larghezza. "contenuto" non scrollabile quindi deve essere grande come il container meno lo spazio del header e del footer

    Ho incontrato diversi problemi per compatibilità crossbrowser ogni volta che sistemavo per uno non funzionava più con un altro e cos' via

    Se non avete capito qualcosa chiedetemi pure..


    Se mi date qualche dritta vi ringrazierei molto

    Un saluto

  2. #2
    c'è il forum CSS e xhtml per questi problemi. Hai dato un'occhiata alla guida sui layout con i CSS di HTML.IT? C'è un'accurata descrizione dei vari layout: a una colonna, due, tre, fissi, fluidi etc. Se vuoi realizzare un layout a dimensioni fisse (cioè che non si adatta alla risoluzione dello schermo) puoi usare i layers di Dreamweaver che sono box(o <div> se preferisci) a posizionamento assoluto

  3. #3
    Utente di HTML.it L'avatar di cyberman
    Registrato dal
    Mar 2002
    Messaggi
    7,543
    io non ho capito una mazza tranne che hai a che fare con css.

    Sposto nel forum adatto.

  4. #4
    Utente di HTML.it
    Registrato dal
    Dec 2004
    Messaggi
    16
    Scusate se ho sbagliato forum ma vedendo grafica e webdesign ho pensato che un layout poteva starci ma non ho pensato al fatto del css

    SI la guida l'ho guardata e ho provato anche a modificare gli esempi ma non sono riuscito a ottenere quello che volevo perchè a seconda del browser c'erano effetti completamente diversi

    Non voglio utilizzare un layout a dimensioni fisse

    Ora ho fatto una immagine Vediamo se ora si capisce meglio


    Grazie dell'attenzione


  5. #5
    Utente di HTML.it
    Registrato dal
    Dec 2004
    Messaggi
    16
    azz mi ero dimenticato di allegare l'immagine


  6. #6
    Utente di HTML.it L'avatar di jepers
    Registrato dal
    Nov 2004
    Messaggi
    214

    layout a 2 colonne

    Prova aleggere questa guida layout a 2 colonne
    Est modus in rebus...

  7. #7
    Utente di HTML.it
    Registrato dal
    Dec 2004
    Messaggi
    16
    ho provato a leggere ma non sono riuscito ancora a giungere al mio obiettivo.
    Il container deve essere sempre grande 90% x 90% dello spazio del browser. anche se gli altri div sono vuoti

    L'header deve essere alto diciamo 80px

    La navigazione e il contenuto devono avere la grandezza che rimane al container, tra l'header e il footer

    La pagina non deve contenere scroll

    Non so se c'è qualcosa ancora che non è chiaro ma penso di aver spiegato tutto ora

  8. #8
    Utente di HTML.it
    Registrato dal
    Dec 2004
    Messaggi
    16
    Se c'è qualcosa di non chiaro dite pure

  9. #9

  10. #10
    chiaro è chiaro ma è complicato in più circostanze per il miscuglio di pixel e percentuali, x%-xpx non esiste.

    avevo trovato una soluzione con due layer a simulare lo sfondo delle colonne ma se il contenuto eccede lo spazio assegnato opera sballa tutto così ti ho fatto un esempio interamente in percentuale, considera che i pixel che nel tuo disegno vedi proporzionati con differenti risoluzioni e monitor la perdono

    <html>
    <head>
    <title>Loskyz 2</title>
    <style type="text/css">
    * {margin:0;padding:0}
    html, body {height:100%}
    body {
    background:gray;
    color:white;
    text-align:center
    }

    .tutto {height:90%;
    position:relative;
    width:90%;
    top:5%;
    margin:auto;
    text-align:left;
    }
    .contenitore {height:95%;
    overflow:auto;
    backgroundlive
    }
    .testa {min-height:10%;
    height:auto!important;
    height:10%;
    background:maroon;
    }
    .piede {min-height:5%;
    height:auto!important;
    height:5%;
    backgroundlive;

    }
    .contenuto {
    height:89%;
    overflow:auto;
    width:60%;
    float:left;
    color:black;
    background:silver
    }
    .menu {width:40%;
    float:left;
    height:89%;
    overflow:auto;
    background:teal
    }
    </style>
    </head>
    <body>
    <div class="tutto">
    <div class="contenitore">
    <div class="testa">testa</div>
    <div class="menu">menù</div>
    <div class="contenuto">contenuto</div>
    </div>
    <div class="piede">piede</div>
    </div>
    </body>
    </html>



    se vuoi togliere lo spazio della barra che non serve aggiungi:

    <!--[if IE 5.5]>
    <style type="text/css">
    body {overflow:auto}
    </style>
    <![endif]-->
    <!--[if IE 6]>
    <style type="text/css">
    body {overflow:auto}
    </style>
    <![endif]-->

    sono commenti condizionati, necessari al posto di inserire la proprietà direttamente nel css principale perché ie5 la toglie ma si riprende lo spazio in .contenitore sballando il layout

    4 pag. x il forum:l'ospite ora ha solo link sponsorizzati, valli a capire-GommaLayout! Agg. 25 agosto 2004)-Molla&Collano privati tecnici, per favore

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