LandyJ
asked on
Firefox Gradient Repeating issue
I am using the following CSS3 for my <body> tag:
body
{
width: 100%;
height:100%;
margin: "0";
padding: "0";
/* default background colour, for all layout engines that don't implement gradients */
background: #ffffff;
background-repeat: no-repeat;
color: #000000; /* text colour (black) */
filter: progid:DXImageTransform.Mi crosoft.Gr adient (startColorstr='#005595', endColorstr='#dddedf', gradientType='0'); /* IE based browsers */
background: -moz-linear-gradient(top, #006595, #dddedf); /* Mozilla (Firefox) based browsers */
background: -webkit-gradient(linear, left top, left bottom, from(#006595), to(#dddedf)); /* webkit based browsers */
FONT-WEIGHT: normal;
FONT-SIZE: 9pt;
FONT-STYLE: normal;
FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif
}
IE works fine, but the background repeats when I scroll in Firefox. I can't figure out how to make it not do that. Please help.
Thanks in advance!
body
{
width: 100%;
height:100%;
margin: "0";
padding: "0";
/* default background colour, for all layout engines that don't implement gradients */
background: #ffffff;
background-repeat: no-repeat;
color: #000000; /* text colour (black) */
filter: progid:DXImageTransform.Mi
background: -moz-linear-gradient(top, #006595, #dddedf); /* Mozilla (Firefox) based browsers */
background: -webkit-gradient(linear, left top, left bottom, from(#006595), to(#dddedf)); /* webkit based browsers */
FONT-WEIGHT: normal;
FONT-SIZE: 9pt;
FONT-STYLE: normal;
FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif
}
IE works fine, but the background repeats when I scroll in Firefox. I can't figure out how to make it not do that. Please help.
Thanks in advance!
ASKER
Thanks for the reply, but that's the code I'm using. In IE, the background stays static, as expected, but in Firefox, when I scroll, the background scrolls also. I apologize for not posting an image of the issue with the original post. Please see the attached image for a clearer picture of what is happening.
Thanks.
FFscrollissue.jpg
Thanks.
FFscrollissue.jpg
what version of firefox as it says for 3.7
you code does seem to be missing some parameters that are on the code on the url
you code does seem to be missing some parameters that are on the code on the url
ASKER
Firefox version, latest and greatest: v17.0.1.
As for the code, if I am looking at the wrong line, I apologize, but:
(their code)
background: -moz-linear-gradient(top, #ccc, #000);
(my code)
background: -moz-linear-gradient(top, #006595, #dddedf);
I appreciate your help...
As for the code, if I am looking at the wrong line, I apologize, but:
(their code)
background: -moz-linear-gradient(top, #ccc, #000);
(my code)
background: -moz-linear-gradient(top, #006595, #dddedf);
I appreciate your help...
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
I have opened another question with a better example and description of this issue, so I'm closing this one.
The new question is at: https://www.experts-exchange.com/questions/27991758/Gradient-background-scrolling-in-Firefox.html
The new question is at: https://www.experts-exchange.com/questions/27991758/Gradient-background-scrolling-in-Firefox.html
http://webdesignerwall.com/tutorials/cross-browser-css-gradient