CSS3 avec dégradé et image de fond fixe...

Réduire
X
 
  • Filtrer
  • Heure
  • Afficher
Tout effacer
nouveaux messages

  • CSS3 avec dégradé et image de fond fixe...

    Hello,

    J'ai un soucis avec ça :

    Code PHP:
    #bandeau {

        
    positionrelative;
        
    height:127px;

        
    /* Anciens navigateurs */
        
    background#7c0c1b url("bandeau-bg.png") repeat-x top;
        
    -o-background-size100100%;
        -
    moz-background-size100100%;
        -
    webkit-background-size100100%;
        
    background-size100100%;
        
        
    /* Navigateurs récents */
        
    background-imageurl("/images/fond-vasa.png"),-webkit-gradient(
            
    linear,
            
    left topleft bottom,
            
    from(#a00c22),
            
    to(#7c0c1b)
        
    );
        
    background-imageurl("/images/fond-vasa.png"),-webkit-linear-gradient(
            
    top,
            
    #a00c22,
            #7c0c1b
        
    );
        
    background-imageurl("/images/fond-vasa.png"),-moz-linear-gradient(
            
    top,
            
    #a00c22,
            #7c0c1b
        
    );
        
    background-imageurl("/images/fond-vasa.png"),-o-linear-gradient(
            
    top,
            
    #a00c22,
            #7c0c1b
        
    );
        
    background-imageurl("/images/fond-vasa.png"),linear-gradient(
            
    top,
            
    #a00c22,
            #7c0c1b
        
    );
        
    /* IE10 */
        
    background-imageurl("/images/fond-vasa.png"),-ms-linear-gradient(
            
    top
            
    #444444, 
            #999999
        
    ); 

        
    background-size:305px 127px;
        
    background-position1000%;
        
    background-repeatno-repeat;
        

    Ceci me permet d'avoir un bandeau qui fait la largeur de mon site, avec un joli dégradé, et une image à droite de mon bandeau.
    Super, SAUF que en fait, mon dégradé ne fait pas toute la largeur de mon bandeau, mais juste la largeur de mon image sur la droite ( soit 305px sur 127px)

    Est ce qu'un maître du CSS3 pourrait m'éclairer ???

    Merci beaucoup !
    Dernière édition par crony à 02/08/2012, 22h33
    Enjoy J!

  • #2
    Re : CSS3 avec dégradé et image de fond fixe...

    Ok trouvé, mais pas bien compris le truc...

    Code PHP:
    #bandeau {

        
    positionrelative;
        
    height:127px;
        
        
    /* Anciens navigateurs */
        
    background#7c0c1b url("bandeau-bg.png") repeat-x top;
        
    -o-background-size100100%;
        -
    moz-background-size100100%;
        -
    webkit-background-size100100%;
        
    background-size100100%;
        
        
    /* Navigateurs récents */

        
    backgroundurl(/images/fond-vasa.png1000no-repeat;
        
    /* Saf4+, Chrome */
        
    backgroundurl(/images/fond-vasa.png1000no-repeat,-webkit-gradient(linear0 00 100%, from(#A00C22), to(#7C0C1B)) 0 0 no-repeat;
        /* FF3.6+ */
        
    backgroundurl(/images/fond-vasa.png1000no-repeat,-moz-linear-gradient(#A00C22, rgba(124, 12, 27, 1)) 0 0 no-repeat;
        /* Chrome 10+, Saf5.1+ */
        
    backgroundurl(/images/fond-vasa.png1000no-repeat,-webkit-linear-gradient(#A00C22, rgba(124, 12, 27, 1)) 0 0 no-repeat;
        /* Opera 11.10+ */
        
    backgroundurl(/images/fond-vasa.png1000no-repeat,-o-linear-gradient(#A00C22, rgba(124, 12, 27, 1)) 0 0 no-repeat;
        /* IE10 */
        
    backgroundurl(/images/fond-vasa.png1000no-repeat,-ms-linear-gradient(#A00C22, rgba(124, 12, 27, 1)) 0 0 no-repeat;
        /* W3C */
        
    backgroundurl(/images/fond-vasa.png1000no-repeat,linear-gradient(#A00C22, rgba(124, 12, 27, 1)) 0 0 no-repeat;
        

    Enjoy J!

    Commentaire

    Annonce

    Réduire
    Aucune annonce pour le moment.

    Partenaire de l'association

    Réduire

    Hébergeur Web PlanetHoster
    Travaille ...
    X