+ Reply to Thread
Results 1 to 13 of 13

Thread: how to make a CSS controlled background gradient

  1. #1
    Moderator airnine is on a distinguished road
    Join Date
    Jan 2004
    Posts
    78

    Unhappy how to make a CSS controlled background gradient

    Help needed,

    I think I came across it a while ago, but I can not find it now. There was this trick on how to make a CSS gradient background,

    it was something like

    background-color: #123456 50%;

    or something like it. That thing is supposed to fill up a table cell or an entire page with gradient background, if anybody knows what I am saying, assist me, please.

    Thank you,

    Airnine
    -------------------------------
    Airnine is a developer @
    www.promomedium.com
    -------------------------------

  2. #2
    Full Member Syn is on a distinguished road
    Join Date
    Jan 2004
    Location
    Providence, RI
    Posts
    23
    I'd like to know this too actually. I never read anything about this, but I'll look as well and try and find this information.
    Personal
    -- Avalonstar: The Moon of Syn

    Professional
    Avalonstar-Intivex, [Coming Soon] | Starvex

  3. #3
    Full Member Interactive is on a distinguished road
    Join Date
    Jan 2004
    Location
    Sierra Vista, AZ, USA
    Posts
    74
    Try this:
    Code:
    <HTML>
    <HEAD>
    <STYLE>
    body
    {
    filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=white,endColorStr=Gainsboro);
    }
    </STYLE>
    </HEAD>
    <BODY>
    </BODY>
    </HTML>
    I believe it's actually only supported in IE.

  4. #4
    Full Member maverik60 is on a distinguished road
    Join Date
    Jan 2004
    Posts
    26
    so u see a bg that shifts from white to blacK? using an image?

  5. #5
    Full Member AdulteratedJedi is on a distinguished road
    Join Date
    Jan 2004
    Posts
    9
    I believe it's actually only supported in IE.
    Yes, filter, is an IE-Only property. So i would suggest not using it.

    AJ

  6. #6
    Moderator airnine is on a distinguished road
    Join Date
    Jan 2004
    Posts
    78
    I never go for stuff supported by only one browser

    and about using an image, well that's not the point, because I want the gradient to stretch no matter how long a page is

    Airnine
    -------------------------------
    Airnine is a developer @
    www.promomedium.com
    -------------------------------

  7. #7
    Full Member Interactive is on a distinguished road
    Join Date
    Jan 2004
    Location
    Sierra Vista, AZ, USA
    Posts
    74
    Originally posted by airnine
    I never go for stuff supported by only one browser

    and about using an image, well that's not the point, because I want the gradient to stretch no matter how long a page is

    Airnine
    I believe you could manipulate a background image with CSS to do that to an extent.
    -Robert Norton
    http://www.HostComb.com - Find The Hosting Provider That Meets Your Needs

  8. #8

    Re: how to make a CSS controlled background gradient

    Originally posted by airnine
    Help needed,

    I think I came across it a while ago, but I can not find it now. There was this trick on how to make a CSS gradient background,

    it was something like

    background-color: #123456 50%;

    or something like it. That thing is supposed to fill up a table cell or an entire page with gradient background, if anybody knows what I am saying, assist me, please.

    Thank you,

    Airnine
    There's not a global way to do this, outside of IE-specific browsers.

    You could get something close by writing a PHP script which outputs gradient images, and then calling the script thru CSS with the proper parameters for the colors, etc.

  9. #9
    Full Member whiteknight is on a distinguished road
    Join Date
    Jan 2004
    Location
    Philadelphia
    Posts
    42
    Interactive: that bit of code doesnt work in my IE, but i am interested to see a working version in action.

    EDIT: yeah, if you take out that space between Microsoft.Gradient, that piece of code works perfectly. Very cool effect, too bad it only works in IE.
    Last edited by whiteknight; January 31st, 2004 at 11:18 PM.

  10. #10
    Full Member Interactive is on a distinguished road
    Join Date
    Jan 2004
    Location
    Sierra Vista, AZ, USA
    Posts
    74
    Originally posted by whiteknight
    Interactive: that bit of code doesnt work in my IE, but i am interested to see a working version in action.

    EDIT: yeah, if you take out that space between Microsoft.Gradient, that peice of code works perfectly. Very cool effect, too bad it only works in IE.
    Yes, the space was there (I didn't add it in, mod must have) because it was parsed into a smily.

    I don't understand why mozilla doesn't adopt it in. That would be awesome and would save me quiet a few GIF's as I use gradients alot.
    -Robert Norton
    http://www.HostComb.com - Find The Hosting Provider That Meets Your Needs

  11. #11
    Web Junky Matt is on a distinguished road
    Join Date
    Dec 2003
    Posts
    71
    Originally posted by Interactive
    Yes, the space was there (I didn't add it in, mod must have) because it was parsed into a smily.

    I don't understand why mozilla doesn't adopt it in. That would be awesome and would save me quiet a few GIF's as I use gradients alot.
    No spaces were added, I opened up the post and selected "Disable Smilies in This Post".
    (The smiley was parsed in this part: progid:DXImageTransform).
    WebmasterLingo.com Team
    Forum Rules

    "Anyone who has never made a mistake has never tried anything new" - Albert Einstein

  12. #12
    Full Member whiteknight is on a distinguished road
    Join Date
    Jan 2004
    Location
    Philadelphia
    Posts
    42
    well, the word "Microsoft" in the call there probably cheeses off a few of the open-source people, and I'm sure none of them have gotten around to writting a compatable second option.

    I'm looking to install some of this code into one of my sites for fun. the mozilla and opera people are just SOL.

    EDIT: I havent been keeping up with the standards, is there any gradient functionality being built into CSS2.0?
    Last edited by whiteknight; February 1st, 2004 at 01:32 PM.

  13. #13
    Full Member albertwalt is on a distinguished road
    Join Date
    Feb 2011
    Posts
    5
    I never supported by the browser and stuff about going to use an image, that's not good, because I would like shields that no matter how long stretch the page. I believe that you can manipulate a background image with CSS to do that to an extent.</span>

+ Reply to Thread

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

     

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts