Visualizzazione dei risultati da 1 a 2 su 2
  1. #1
    Utente di HTML.it
    Registrato dal
    May 2011
    Messaggi
    5

    problema allineamento div

    Ciao a tutti,
    Sto creando un template con tre colonne, realizzate ovviamente con dei div, che occupano tutta la pagina. Per far si che siano grandi come tutta la pagina con qualsiasi risoluzione ho usato dei valori percentuali e non dei valori in pixel.
    Ora voglio applicare uno sfondo che vada bene ad ogni colonna. Si tratta di uno sfondo molto semplice che faccia sembrare i bordi dei div arrotondati. Visto che come sfondo alla pagina ho messo una texture vorrei che questa immagine sia leggermente trasparente.
    Per creare questo effetto ho creato delle immagini per creare gli angolini in questo modo:

    Ho creato anche un quadratino colorato con lo stesso colore e trapsarenza dell'immagine di sopra, in modo poi da creare lo sfondo.
    In cima al div della colonna ho creato un altro div(base), alto come l'immagine dell'angolino e lungo il 100% della colonna. Poi ho creato, al suo interno, due altri div alti il 100% del div base e larghi come l'immaginina (13px).
    Mi sono sorti due problemi:
    Il primo è che non so come allineare il div che contiene l'angolino destro a destra del div base.
    Il secondo è che i div angolini essendo in trasparenza risultano più scuri xke hanno sotto il div base che ha come sfondo l'immagine a quadratino.

    Qualcuno sa come fare?

  2. #2
    Utente di HTML.it L'avatar di Prill
    Registrato dal
    Oct 2006
    Messaggi
    2,947
    Ciao sonne, sarebbe utile vedere tutto il codice della pagina per capire meglio dove debbano andare gli angoli. Forse più semplicemente potresti creare dei bordi arrotondati sfruttando la proprietà border-radius dei css3. Tale proprietà non è però supportata da versioni di Explorer inferiori alla 9, per le quali esistono però degli script che permettono di ottenere lo stesso effetto (puoi fare una ricerca qui nel forum per border-radius e pie)

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.