Visualizzazione dei risultati da 1 a 3 su 3
  1. #1
    Utente di HTML.it L'avatar di Lup!n
    Registrato dal
    Apr 2004
    Messaggi
    91

    layout con css, contenitore, news, menu

    Ho qualche piccolo problemi con i layout, dovrei costruire un layout organizzato in questa maniera:


    1 - contenitore
    1.2 - news
    1.3 - menu

    quindi dl punto di vista gerarchi news e menu sono sullo stesso piano


    il codice html per una pagina del genere dovrebbe essere cosi :

    <div id="contenitore">CONTENITORE



    <div id="news"></div>NEWS</div>



    <div id="menu"></div>MENU</div>
    </div>

    giusto ?

    per il css invece ho un po di problemi, il css che fino adesso scritto è cosi


    #contenitore {width : 580px;
    border: 1px solid #000;
    margin: 1px auto; }

    #news {
    position : absolute;
    border: 1px solid #000; }

    #menu {position : absolute;
    border: 1px solid #000;
    width : 400px;
    height : 100px;
    }

    ma a quanto pare non funziona.....
    sicuramente non ho ben capito la funzione degli attributi position e quindi li applico male....
    Powered by Gentoo Linux

  2. #2
    Utente di HTML.it L'avatar di floyd46
    Registrato dal
    Feb 2002
    residenza
    Apulia
    Messaggi
    2,641

    Re: layout con css, contenitore, news, menu

    ciao
    prova a copiare ed incollare il codice che ho riportato in una pagina html; fa attenzione al Doctype che inserisci, però.
    potresti avere diverse visualizzazioni nei browser.

    codice:
    <style type="text/css" media="screen">
    html, body{
    margin:0;
    padding:0;
    font-family:Verdana, sans-serif;
    font-size:90%;
    text-align:center;
    }
    #container {
    width:580px; 
    margin: 10px auto; 
    padding:0;
    border:1px solid #000;
    height:400px;
    }
    #menu{
    width:140px;
    margin:0;
    padding:0;
    background:#ddd;
    float:left;
    height:100%;
    text-align:left;
    }
    #menu h3{
    padding-left:5px;
    }
    #menu p{padding-left:5px;}
    #news{
    margin:0;
    padding-left0;
    background:#666;
    text-align:left;
    height:100%;
    float:left;
    width:440px;
    }
    #news h3{padding-left:5px;}
    #news p{padding-left:5px;}
    </style>
    e tra i tag <body> scrivi questo codice:

    codice:
    <div id="container">
    
    	<div id="menu">
    	<h3>Menu</h3>
    	
    
    Prima voce</p>
    	
    
    Seconda voce</p>
    
    	</div>
    
    	<div id="news">
    	<h3>Titolo news</h3>
    	
    
    Lorem ipsum dolor sit amet.........</p>
    	</div>
    </div>
    Ovviamente nel menu puoi usare una lista ordinata o non ordinata;
    a te la scelta.
    Fammi sapere come va.
    saluti
    -Floyd-
    "Le persone che realizzano layout con tabelle annidate, spacer gif o che ignorano l'accessibilità non possono più definirsi professionisti." Andy Clarke
    --------------------------------

    www.extrowebsite.com

  3. #3
    Utente di HTML.it L'avatar di Lup!n
    Registrato dal
    Apr 2004
    Messaggi
    91
    grazie , adesso mi studio il codice e vedo di capirci qualcosa
    Powered by Gentoo Linux

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.