2012-08-13 3 views
2

J'ai un gradient CSS qui exécute la hauteur de la page:dégradé court quand je redimensionne ma fenêtre

html { 
    font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif; 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e5fcc2), color-stop(47%,#ecfdd2), color-stop(100%,#fafef3)); 
    background-image: -moz-linear-gradient(#e5fcc2, #fafef3); 
    background-repeat: no-repeat; 
    height: 100%; 
} 

Pourtant, pour une raison quelconque, quand je remets à la côte ma fenêtre, en particulier quand je fais plus petit, il est une grande zone blanche au bas de la page où le gradient déborde. Quand la fenêtre est longue, je n'ai pas ce problème.

Une idée pour résoudre ce problème?

+2

vous devez spécifier pour quel navigateur vous avez ce problème. De plus, la version est importante. Par exemple, chrome 10+ utilise une autre commande de dégradé puis chrome <10 –

+0

Quel navigateur utilisez-vous? Je ne peux pas reproduire cela sur chrome: http://jsfiddle.net/RCrZQ/ –

+0

En utilisant Chrome 21 mais les choses vont bien dans Safari 6. Cela se produit également dans FF 12, qu'est-ce que je dois ajouter à ce code pour ce pas se passer? 'fixed'? –

Répondre

1

Compris cela.

nécessaire pour définir min-height: 100% qui a travaillé sur Chrome 21, FF 12 et Safari 6. J'avais aussi background-repeat: no-repeat; dans le bloc html.

Questions connexes