How to make a gradient BG right length/width with css in a table?

Discussion in 'CSS' started by kb1, Feb 28, 2007.

  1. #1
    Hello

    New to css

    if you go to

    http://www.enhancedwireless.net/Company/who.shtml

    and see the left BLUE nav bar - well I want to turn that into a same color blue, gradient nav bar, lighter on top to darker on bottom - so in Photoshop would I make a small 1 px by 1 px png or gif and apply css to it to fill the table? If so, wondering how?

    Would I set the background image and then repeat y? Or do I need to make the png/gif bigger and use repeat x? Not sure yet...

    Thanks very much

    KB
     
    kb1, Feb 28, 2007 IP
  2. Maujor

    Maujor Peon

    Messages:
    30
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #2
    To achieve the effect you are trying do the following:
    Do you have a image named subNavBack.jpg with 140 x 345 px filled with solid blue.
    1-) rename that image to subNavBackOLD.jpg in case something goes wrong;
    2-) Draw a rectangle 140 x 200px and apply your vertical gradient.
    3-) Save this image as subNavBack.jpg and upload it overwriting the OLD one.
    This is the easiest way for your actual markup.
    Sure you can set CSS rules but this imply in assign a class or ID to the td where the nav resides etc.
    Be aware: your ligther blue must provide sufficient contrast with the white text on the navigation links.
    Hope this help.
     
    Maujor, Mar 1, 2007 IP
  3. kb1

    kb1 Peon

    Messages:
    5
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Thanks very much for your helpful reply

    KB
     
    kb1, Mar 1, 2007 IP