Visualizzazione dei risultati da 1 a 3 su 3
  1. #1
    Utente di HTML.it
    Registrato dal
    Nov 2005
    Messaggi
    24

    Problema visualizzazione css

    ciao a tutti ed auguri,
    Con il seguente css, ho riscontrato i seguenti problemi....

    <style type="text/css">

    /*tolta l'immagine da preamble perchè in IE 5.0, mi viene spostata di un paio di pixel a sx, quindi creato un altro livello ma non risco a visualizzarlo se non ci scrivo una lettera dentro al livello!!*/

    #preamble {
    /*BACKGROUND: url(coloursGG.gif) no-repeat 50% bottom;*/
    CLEAR: both;
    PADDING-RIGHT: 20px;
    PADDING-LEFT: 20px;
    PADDING-BOTTOM: 30px;
    PADDING-TOP: 20px;
    MARGIN-LEFT: 190px;
    WIDTH: 306px;
    border:1px solid #71828a;
    border-color: #0000FF;
    }
    /*#fine_preamb{
    background-image: url(coloursGG.gif);
    background-repeat: no-repeat;
    padding: 50px;
    }*/

    </style>
    </head>

    <body>
    <div id=preamble>
    <H3><SPAN>Home Page</SPAN></H3>


    <SPAN>hfbgdfhgbdfjbgjdbfg dsnfksjg ikbfjshydfbjshbd sjfgsjyfgsiuf goidhgkdhhkgfd sdjhfgjdfgsdjhfgsdjf </SPAN></P>




    prova spaziatura</p>
    </div>

    </body>
    </html>


    Nel primo caso, utilizzando solo il div #preamble, con IE 5.0, l'immagine mi viene sballata perche??????, con IE 5.0 tutto OK....

    Quindi mi sono detto di creare un altro livello, che contenesse solo l'immagine, e se ci crivi qualche cosa dentro al div tutto ok anche come visualizzazione ma se metto solo senza nessuna lettera, l'immagine non mi viene visualizzata e non capisco dove vada....

    Avete qualche idea??? THK

    PS: deve superare la convalida dei CSS

    FDR

  2. #2
    Così, a occhio, posso dirti tre cose.

    1. Nessuno dei due div ha impostata un'altezza (il secondo non ha impostata neppure una larghezza), ma solo dei padding. E' vero che lo sfondo viene "esteso" anche all'area del padding, ma non mi pare molto corretto impostare il codice in quel modo. Chiaramente, se scrivi qualcosa in un div senza averne impostato l'altezza, otterrai che quel div sarà alto tanto quanto basta a contenere il testo che ci hai scritto.

    2. Se puoi, evita di usare combinazioni di valori e parole chiave per la posizione dell'immagine di sfondo (alcuni browser hanno problemi). Ad es., invece che "50% bottom", potresti impostarla come "50% 100%" o come "center bottom".
    Inoltre, usando background come proprietà-scorciatoia per impostare in una sola volta tutte le caratteristiche dello sfondo, sarebbe bene indicare anche un colore (background, per essere valida, deve indicare ALMENO il colore). Se non hai colore di sfondo, sarebbe più corretto usare background-image, background-repeat e background-position separatamente (anche se cmq dovrebbe funzionare lo stesso come hai fatto...è che non uso mai background! ).

    3. Ricorda che IE 5 (e anche il 6 quando lavora in quirks mode) ha un fastidiosissimo problema nel box model. Mentre lo standard per il box model approvato dal W3C dice che la larghezza (e altezza) totale di un box è data dalla larghezza (altezza) dei suoi contenuti PIU' eventuali padding, border e margin, IE 5 considera i padding e i border come facenti parte della larghezza (altezza) dei contenuti. Ad es.:

    width: 200px;
    padding: 20px;
    border: 1px solid #000000;
    margin: 10px;

    Per un browser aderente agli standard come Firefox, il box a cui applichi la regola di stile qui sopra è largo 262px (200 + 2*20 + 2*1 + 2*10).
    Per IE 5 (e 6 in modalità compatibile) lo stesso box è largo 220px (200 + 2*10). Questo perché IE 5 considera i valori di padding e border COMPRESI nel valore di width!

  3. #3
    Utente di HTML.it
    Registrato dal
    Nov 2005
    Messaggi
    24
    l'altezza.......... ciao e grazie per i consigli!!!
    FDR

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.