Visualizzazione dei risultati da 1 a 10 su 10
  1. #1
    Utente di HTML.it
    Registrato dal
    Sep 2005
    Messaggi
    169

    problema immagine testo

    ciao a tutti,
    da un po' sto sbattendo la testa per ottenere una sezione composta da un'immagine, un titolo e un paragrafo utilizzando float e clear.
    L'ho già fatto e nn ho avuto problemi, ora integrandolo in un codice più ampio mi crea problemi; il testo si sovrappone all'immagine .... nn riesco a vedere dove ho sbagliato!!
    Ho copiato di pari passo l'esempio che ho trovato sulla guida ma niente...



    Ecco il codice

    (HTML)

    <div id="intestazione">
    [img]immagini/harrods.jpg[/img]</img>
    <h2>Michel Tcherevkoff: Shoe-Fleur: A Footwear Fantasy</h2>



    In the middle of a commercial shoot, inspiration struck Michel Tcherevkoff. The photo of a leaf lay upside down on the table, and he heard himself say: "Hey, that looks like a shoe." Shortly thereafter, the photographer went tripping down fantasy lane on a whimsically inventive project called "Shoe-Fleur." Using flowers and leaves as raw materials, Tcherevkoff fashioned them into a collection of shoes that would never walk down a runway but would convey him and his feats of fancy to the Museum of Art and Design in New York.
    </p>
    <div class="clearer"></div>
    </div>




    (CSS)
    /*--------------------------------------------------------------*/
    /* ELEMENTI INTERNI: INTESTAZIONE
    /*--------------------------------------------------------------*/

    /************************************************** ***********/
    /* FORMATTAZIONE PER L'IMMAGINE DELL'ARTICOLO
    /************************************************** ***********/
    #intestazione img{
    float:left;
    margin: 10px;
    border: 2px solid white;
    }

    /************************************************** ***********/
    /* FORMATTAZIONE PER I TITOLI DELL'ARTICOLO
    /************************************************** ***********/
    #intestazione h2{
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 15px;
    color: white;
    font-style:italic;
    text-decoration:underline;
    border: 2px solid black;
    text-align:justify;
    }


    /************************************************** **********/
    /* FORMATTAZIONE PER L'ABSTRACT
    /************************************************** **********/
    #intestazione p {
    font-family:"Times New Roman", Times, serif;
    font-size: 14px;
    color: #FFFFFF;
    font-style:italic;
    text-align:justify;
    }

    div.clearer{
    clear: left
    }


    VI PREGO DATEMI UNA MANO!!!
    D'inverno lo snowboard,
    A primavera lo skateboard,
    D'estete il kite-surf
    ..e in autunno???

  2. #2
    L'ho provato e non mi sis sovrappone niente. L'unica cosa è che l'im, in quanto float, non è più contenuta nel "riquadro nero" (#intestazione)
    Fantasupermegafavolipermeramagicultra irresistibili
    4 10 30 100 1001 personaggi insuperabili fantaincredibili ultraimpossibili iperterribili irresistibili!!!

    "... a quell'età ... bastava un dito per fare la pace ..."
    fotine

  3. #3
    Utente di HTML.it
    Registrato dal
    Sep 2005
    Messaggi
    169
    ..il riquadro nero nn è l'intestazione.il css dell'intestazione mi sà che nn l'ho postato, cmq racchiude la foto, il titolo e il paragrafo....

    Il problema che il testo si sovrappone con l'immagine me lo dà con Safari, provando invece Camino e Firefox questo nn succede però in questi ultimi 2 ho il problema che nn mi visualizza la navigazione in alto...


    Cosa posso fare?
    D'inverno lo snowboard,
    A primavera lo skateboard,
    D'estete il kite-surf
    ..e in autunno???

  4. #4
    mmm.. cosa intendi per navigazione in alto?
    potresti postare il codice o spiegare meglio la struttura della pagina?

  5. #5
    Originariamente inviato da stagestar
    Cosa posso fare?
    Una cosa del genere? (ho scritto un po' allasvelta....)
    codice:
    CSS
    #intestazione { width:600px; border:1px solid red;}
    
    #intestazione img {
    float: left;
    margin: 10px;
    border: 2px solid white;
    }
    
    /*************************************************************/
    /* FORMATTAZIONE PER I TITOLI DELL'ARTICOLO
    /*************************************************************/
    #intestazione h2{
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 15px;
    font-style:italic;
    text-decoration:underline;
    border: 2px solid black;
    text-align:justify;
    }
    
    
    /************************************************************/
    /* FORMATTAZIONE PER L'ABSTRACT
    /************************************************************/
    #intestazione p {
    font-family:"Times New Roman", Times, serif;
    font-size: 14px;
    font-style:italic;
    text-align:justify;
    }
    
    
    HTML
    <div id="intestazione">
    	[img]/img/dsdsdsds.jpg[/img]</img>
    	<div style="margin-left:50% ">
    		<h2>Michel Tcherevkoff: Shoe-Fleur: A Footwear Fantasy</h2>
    		
    
    
    		In the middle of a commercial shoot, inspiration struck Michel Tcherevkoff. The photo of a leaf lay upside down on the table, and he heard himself say: "Hey, that looks like a shoe." Shortly thereafter, the photographer went tripping down fantasy lane on a whimsically inventive project called "Shoe-Fleur." Using flowers and leaves as raw materials, Tcherevkoff fashioned them into a collection of shoes that would never walk down a runway but would convey him and his feats of fancy to the Museum of Art and Design in New York.
    		</p>
    	</div>
    </div>
    Fantasupermegafavolipermeramagicultra irresistibili
    4 10 30 100 1001 personaggi insuperabili fantaincredibili ultraimpossibili iperterribili irresistibili!!!

    "... a quell'età ... bastava un dito per fare la pace ..."
    fotine

  6. #6
    Utente di HTML.it
    Registrato dal
    Sep 2005
    Messaggi
    169
    Questa è la struttura del sito:
    navigazione_top che comprende il nome del sito, utility e la barra di navigazione in alto (cosiddetta globalnav)

    poi la pagina centrale che comprende una barra di navigazione laterale dx e sx, al centro c'è il nome della pagina e il contenuto. All'intero del contenuto c'è il famoso div #intestazione (foto+titolo+abstract) e un'altro div sotto.

    alla fine il footer.....
    D'inverno lo snowboard,
    A primavera lo skateboard,
    D'estete il kite-surf
    ..e in autunno???

  7. #7
    Ho capito (certo con il codice sarebbe piu' facile!), strano pero' che non ti visualizzi tutto #globalnav se ho capito bene.

    Ma la pagina centrale te la attacca al bordo di sopra?

    Comunque credo che ti convenga postare qualcosa sulla compatibilita' dei browsers e cosa fare per risolvere questi problemi.
    Io purtroppo non saprei aiutarti molto su questo perche' ho iniziato da poco con i CSS,
    spero che qualcun'altro piu' esperto di me ti sappia dare una mano!

  8. #8
    Non so se sto andando fuori topic, ma forse questo ti potrebbe aiutare:
    http://css.html.it/articoli/leggi/45...blemi-dei-css/

    Nel primo post di questo forum ci sono tanti link utili..

  9. #9
    Utente di HTML.it
    Registrato dal
    Sep 2005
    Messaggi
    169
    ho provato il codice, purtroppo però nn mi cambia niente.....
    nn so....
    ..cmq grazie lo stesso
    D'inverno lo snowboard,
    A primavera lo skateboard,
    D'estete il kite-surf
    ..e in autunno???

  10. #10
    Utente di HTML.it
    Registrato dal
    Sep 2005
    Messaggi
    169
    proverò a leggerlo sicuramente mi sarà di aiuto!!

    grazie
    D'inverno lo snowboard,
    A primavera lo skateboard,
    D'estete il kite-surf
    ..e in autunno???

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.