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

    Dimensionamento div in base al contenuto

    Ciao,
    Nel mio sito ho un div #Corpo che contiene una serie di contenuti per lo più scritti. A #Corpo è associato via css un background che si ripete lungo l'asse y.
    Io vorrei che #Corpo abbia il parametro "height" relazionato ai contenuti, ma usando "auto" diventa piccolissimo e non capisco perché. Sono costretto a settarlo manualmente in ogni pagina.
    Questo è il link del sito www.romasantandrea.sism.org/, usando un debugger provate a mettere auto nella height di #Corpo e vedrete cosa intendo.

  2. #2
    Utente di HTML.it L'avatar di emnlmn
    Registrato dal
    Oct 2008
    Messaggi
    263
    Il tuo problema è dovuto al fatto che #corpo contiene al suo interno solamente blocchi flottanti. che per loro natura sono estratti dal flusso e pertanto non influenzano le dimensioni del blocco genitore.
    Il metodo più rapido per risolvere è aggiungere la proprietà overflow:hidden; alla regola del #corpo.


  3. #3
    Ciao,
    Ti ringrazio! Il problema "verticale" è stato risolto però... adesso è insorto un problema "orizzontale"! Uno dei link che prima sporgeva al di fuori del #Corpo (l'ultimo) risultava tagliato. Ho risolto dando un margin-left di -1em ed un padding-left di 1em per allargare a destra e poi rispingere il contenuto a sinistra.

    Ci sono metodi più eleganti?

    PS: Perché con overflow: hidden si è risolto il problema di prima? qual è la logica?

  4. #4
    prova anche con overflow: auto;

  5. #5
    Ci ho provato ma mi escono le barre di scorimento verticali e orizzontali (figo da vedere: si muovono le scritte ma lo sfondo rimane fermo!! non molto utile però)

  6. #6
    che versione di IE hai??...io con la 8 vedo il tuo sito perfettamente!

  7. #7
    Uso safari. Infatti adesso funziona; con l'overflow ho risolto il problema del dimensionamento automatico verticale e con un po' di lavoro su margin e padding ho risolto il problema dei link che venivano tagliati perché uscivano fuori dal #Corpo.

    codice:
    #Corpo {
    		background: transparent url(http://www.romasantandrea.sism.org/i...ackg_Corpo.png) repeat-y 0.5em;
    		margin-right: -3em;  //notare margine e padding opposti
    		padding-right: 3em;
    		margin-top: -7.2em;
    		display: block;
    		padding-top: 7em;
    		height: auto;
    		overflow: hidden;
    		padding-bottom: 10em;
    	}
    Mi chiedevo solo come mai overflow: hidden risolvesse questo problema e se c'era una maniere più elegante di margin e padding opposti per l'overflow orizzontale.

    PS: se guardi il sito con safari 4 ci sono un po' di animazioni carine in giro.

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.