Visualizzazione risultati 1 fino 8 di 8

Discussione: non si allunga il div contenitore come posso risolvere?

  1. #1
    Guest

    Talking non si allunga il div contenitore come posso risolvere?

    Ciao a tutti, sto combattendo con il solito template.
    allora ho creare la pagina html:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
    <title>{pagetitle}</title>
    <meta content="text/html; charset={encoding}" http-equiv="content-type" />
    <link href="{themeroot}/style.css" rel="stylesheet" type="text/css" />
    <meta name="description" content="{description}" />
    <meta name="keywords" content="{keywords}" />
    <link href="style.css" rel="stylesheet" type="text/css" />

    {additional}
    </head>

    <body{bodytag}>
    <div align="center"><div class="contenitore">
    <div class="contenitor2">
    <div class="head"></div>
    <div class="sep"></div>
    <div class="left">{loop name="lblocks"}
    <div class="menu">
    <div><h2>{title}</h2>
    <div>{content}</div>
    </div>
    </div>
    {/loop name="lblocks"}
    </div>
    <div class="testo">
    <div class="testo2">{content} </div>
    </div>
    </div>
    <div class="footer"><br />
    Pagina generata in {sqltime} secondi con {sqlnum} queries. <br />
    <a href="{cplink}">Control Panel</a>
    </div>
    </div></div>
    </body>
    </html>
    e poi ho creato il file css:

    .contenitore {
    height: 900px;
    }
    .contenitor2 {
    height: 525px;
    width: 780px;
    text-align: justify;
    background-image: url(images/sfon.png);
    background-repeat: repeat-y;
    background-position: center;
    }
    .sep {
    height: 25px;
    background-image: url(images/sep.jpg);
    background-repeat: no-repeat;
    background-position: center;
    }
    .menu {
    height: auto;
    width: 150px;
    margin-right: 5px;
    margin-left: 5px;
    margin-top: 10px;
    border-right-width: thin;
    border-bottom-width: thin;
    border-left-width: thin;
    border-right-style: dotted;
    border-bottom-style: dotted;
    border-left-style: dotted;
    border-right-color: #525252;
    border-bottom-color: #525252;
    border-left-color: #525252;
    }
    .menu a:link {
    background-color: #FFFFFF;
    background-image: url(images/freccetta.jpg);
    background-repeat: no-repeat;
    background-position: 3px center;
    text-indent: 24px;
    display: block;
    line-height: 20px;
    color: #006600;
    text-decoration: none;
    vertical-align: middle;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    }
    .menu a:visited {
    background-image: url(images/freccetta.jpg);
    background-repeat: no-repeat;
    background-position: 3px center;
    background-color: #FFFFFF;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: #006600;
    text-decoration: none;
    line-height: 20px;
    text-indent: 24px;
    vertical-align: middle;
    display: block;
    }
    .menu a:hover {
    color: #0066FF;
    text-decoration: underline;
    background-image: url(images/freccetta2.jpg);
    background-repeat: no-repeat;
    background-position: 3px;
    border-right-width: medium;
    border-right-style: solid;
    border-right-color: #006699;
    }

    .menu h2 {
    font-family: Impact;
    font-size: 16px;
    color: #FFFFFF;
    background-image: url(images/top.gif);
    background-repeat: repeat;
    text-align: center;
    line-height: 25px;
    font-weight: lighter;
    }


    .testo {
    height: 300px;
    width: 580px;
    margin-right: 15px;
    float: right;
    }
    .testo2 {
    height: 200px;
    width: 560px;
    margin-top: 25px;
    margin-right: 10px;
    margin-left: 10px;
    }



    .head {
    height: 200px;
    background-image: url(images/mondopancione.jpg);
    background-repeat: no-repeat;
    background-position: center;
    }
    .left {
    height: 300px;
    width: 160px;
    margin-left: 15px;
    float: left;
    }
    .footer {
    height: 50px;
    text-align: center;
    width: 780px;
    float: no;
    }
    body {
    background-image: url(images/sfondo.jpg);
    background-repeat: repeat;
    }
    ul {
    list-style-type: none;
    margin-left: 0px;
    padding-left: 0px;
    }
    Il problema è che quando al div testo2 viene scritto il testo con il cms, il contenitore non si allunga e la scritta va a finire sopra al footer, come posso far in modo che il contenitore e contenitore 2 si allunghino in corrispondenza al testo nel div testo2??

    Grazie mille e auguri a tuttiiiiiii

  2. #2
    Guest

    Predefinito

    Codice:
    .testo2 {
    height: 200px;
    width: 560px;
    margin-top: 25px;
    margin-right: 10px;
    margin-left: 10px;
    }
    prova a non specificare il tag height

  3. #3
    Guest

    Predefinito

    ciao grafikando ho gia provato questa soluzione, con height auto... ma il risultato è lo stesso, il footer non scorre e il contenitor2 non si allunga

  4. #4
    L'avatar di dreadnaut
    dreadnaut non è connesso Super Moderatore
    Data registrazione
    22-02-2004
    Messaggi
    6,306

  5. #5
    Guest

    Predefinito

    grazie dreadnaut per il link... ma non ho capito gran che eheheh sono un po ignorante in inglese!!! cosa dovrei fare?

  6. #6
    L'avatar di dreadnaut
    dreadnaut non è connesso Super Moderatore
    Data registrazione
    22-02-2004
    Messaggi
    6,306

    Predefinito

    aggiungere il pezzo di codice verso il fondo della pagina al tuo css e dare la class="clearfix" al contenitore dei div che si deve allungare.

    Se cerchi clearfix sul forum, troverai altri thread sull'argomento che ti possono aiutare

  7. #7
    Guest

    Predefinito

    niente non funziona... ho provato in tutti i modi possibili...

    Altre idee?

  8. #8
    L'avatar di dreadnaut
    dreadnaut non è connesso Super Moderatore
    Data registrazione
    22-02-2004
    Messaggi
    6,306

    Predefinito

    primo direi: usa gli id invece dei class quando gli elementi sono unici. Poi dai class="clearfix" al div contenitore2.

    Potresti mettere online una pagina di prova con un po' di contenuto, perché così sul template è un po' dura capire

Regole di scrittura

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