Gradient

• 

  lvbroker · Member · Oct 14, 2014 at 9:59 am

  • Copy link
  • Add topic to favorites

  Hey,

  Can somebody help me with the css code please.

  How do i add a gradient for the border of a bacground. atm it is grey, it would need to be a limey green with a gradient. This would be the border background outside the pages content.

  Than you

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · Oct 14, 2014 at 2:08 pm

  • Copy link

  The CSS selector will depend on where you want to put the gradient, and can get a little involved. Can you let us know where you want to put the border and also how you want it to show (dark to light)?

• 

  lvbroker · Member · Oct 14, 2014 at 2:57 pm

  • Copy link

  I want it as the background image.

  I would want a lime green gradient with shades of white in the background….

• 

  thesacredpath · Member · Oct 14, 2014 at 4:24 pm

  • Copy link

  Yes, but where do you want that gradient? Where the lime green is now, ouside the edges of your content area, or do you want the content area to have the gradient? You mention a grey area, but I’m not seeing a grey area.

• 

  thesacredpath · Member · Oct 14, 2014 at 4:35 pm

  • Copy link

  If you want it where the lime green is now, try the following CSS.

  body.custom-background {
  background: #bbdd33; /* Old browsers */
  background: -moz-linear-gradient(top,  #bbdd33 0%, #ffffff 60%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#bbdd33), color-stop(60%,#ffffff)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #bbdd33 0%,#ffffff 60%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #bbdd33 0%,#ffffff 60%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #bbdd33 0%,#ffffff 60%); /* IE10+ */
  background: linear-gradient(to bottom,  #bbdd33 0%,#ffffff 60%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bbdd33', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
  }