terryds Posted February 27, 2013 Share Posted February 27, 2013 Hello guys.. I've a trouble in making a rainbow bokeh pattern as a background. Look at my code below : <!DOCTYPE HTML><html><head><style>body {/* Chrome */background-image:-webkit-radial-gradient(center, rgba(255, 255, 255, 0) 0px, rgba(255, 255, 255, 0.14902) 30%, rgba(255, 255, 255, 0.298039) 32%, rgba(255, 255, 255, 0) 33%),-webkit-radial-gradient(center, rgba(255, 255, 255, 0) 0px, rgba(255, 255, 255, 0.0980392) 11%, rgba(255, 255, 255, 0.298039) 13%, rgba(255, 255, 255, 0) 14%),-webkit-radial-gradient(center, rgba(255, 255, 255, 0) 0px, rgba(255, 255, 255, 0.2) 17%, rgba(255, 255, 255, 0.431373) 19%, rgba(255, 255, 255, 0) 20%),-webkit-radial-gradient(center, rgba(255, 255, 255, 0) 0px, rgba(255, 255, 255, 0.2) 11%, rgba(255, 255, 255, 0.4) 13%, rgba(255, 255, 255, 0) 14%),-webkit-radial-gradient(center, rgba(255, 255, 255, 0) 0px, rgba(255, 255, 255, 0.2) 11%, rgba(255, 255, 255, 0.4) 13%, rgba(255, 255, 255, 0) 14%),-webkit-radial-gradient(center, rgba(255, 255, 255, 0) 0px, rgba(255, 255, 255, 0.0980392) 11%, rgba(255, 255, 255, 0.2) 13%, rgba(255, 255, 255, 0) 14%),-webkit-linear-gradient(45deg, rgb(52, 55, 2) 0%, rgb(24, 69, 0) 20%, rgb(24, 117, 70) 30%, rgb(0, 103, 130) 40%, rgb(11, 18, 132) 50%, rgb(118, 14, 161) 60%, rgb(131, 9, 110) 70%, rgb(132, 11, 42) 80%, rgb(177, 62, 18) 90%, rgb(226, 116, 18) 100%);background-attachment: initial, initial, initial, initial, initial, initial, initial;background-origin: initial, initial, initial, initial, initial, initial, initial;background-clip: initial, initial, initial, initial, initial, initial, initial;background-color: rgb(132, 11, 42);background-size: 470px, 970px, 410px, 610px, 530px, 730px, 100%;background-position: 0px 0px, 0px 0px, 0px 110px, -130px -170px, 130px 370px, 0px 0px;/* Firefox */background:radial-gradient(rgba(255, 255, 255, 0) 0px, rgba(255, 255, 255, 0.15) 30%, rgba(255, 255, 255, 0.3) 32%, rgba(255, 255, 255, 0) 33%) repeat scroll 0 0 / 470px 470px,radial-gradient(rgba(255, 255, 255, 0) 0px, rgba(255, 255, 255, 0.1) 11%, rgba(255, 255, 255, 0.3) 13%, rgba(255, 255, 255, 0) 14%) repeat scroll 0 0 / 970px 970px,radial-gradient(rgba(255, 255, 255, 0) 0px, rgba(255, 255, 255, 0.2) 17%, rgba(255, 255, 255, 0.43) 19%, rgba(255, 255, 255, 0) 20%) repeat scroll 0 110px / 410px 410px, radial-gradient(rgba(255, 255, 255, 0) 0px, rgba(255, 255, 255, 0.2) 11%, rgba(255, 255, 255, 0.4) 13%, rgba(255, 255, 255, 0) 14%) repeat scroll -130px -170px / 610px 610px,radial-gradient(rgba(255, 255, 255, 0) 0px, rgba(255, 255, 255, 0.2) 11%, rgba(255, 255, 255, 0.4) 13%, rgba(255, 255, 255, 0) 14%) repeat scroll 130px 370px / 530px 530px,radial-gradient(rgba(255, 255, 255, 0) 0px, rgba(255, 255, 255, 0.1) 11%, rgba(255, 255, 255, 0.2) 13%, rgba(255, 255, 255, 0) 14%) repeat scroll 0 0 / 730px 730px,linear-gradient(45deg, #343702 0%, #184500 20%, #187546 30%, #006782 40%, #0B1284 50%, #760EA1 60%, #83096E 70%, #840B2A 80%, #B13E12 90%, #E27412 100%) repeat scroll 0 0 / 100% 100% #840B2A}</style></head><body></body></html> The code is bad for firefox, very bad for chrome.. I don't know why it doesnt look like http://lea.verou.me/css3patterns/#rainbow-bokeh Can someone please fix the code for me, and make it better ? Link to comment Share on other sites More sharing options...
terryds Posted March 9, 2013 Author Share Posted March 9, 2013 Bumping... Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now