0

Here is code: 

style="background-image: linear-gradient(151deg,#6a7a8f 9%,#8692A4 30%,#a9b1be 49%, #ced2d9 66%, #f1f0f1 88%),url(<?php echo $page['image']; ?>);"

It is on the div, for some reason the linear gradient is the only things that appears. When I put the url() in front of the linear-gradient, then the image is the only that appears.

I checked out the other stackoverflow questions that are pretty similar, but I can't get it to work.

kennysong
  • 504
  • 2
  • 6
  • 23
  • Can you show us the resulting HTML rendered by WordPress? (ie: View-source in your browser, as opposed to what you're editing in the WordPress editor.) Additionally, could you isolate it to a jsfiddle? According to http://stackoverflow.com/questions/2504071/is-it-possible-to-combine-a-background-image-and-css3-gradients, it looks fine. – Paul Apr 16 '15 at 23:12

1 Answers1

2

You are using solid colors (HEX), so they cover your image. You must to use RGBA colors.

Like this:

style="background-image: linear-gradient(151deg,rgba(106,122,143,0.5) 9%,rgba(134,146,164,0.5) 30%,rgba(169,177,190,0.5) 49%, rgba(206,210,217,0.5) 66%, rgba(241,240,241,0.5) 88%),url(<?php echo $page['image']; ?>);"
Joseph
  • 51
  • 5
  • This is true - in a way. But if you should clarify - putting the url() part first, you'd have the image over the top of the gradient. – Paul Apr 16 '15 at 23:13
  • Not sure what the OP is wanting, asked for clarification on what's rendered vs. what's being edited in WP. – Paul Apr 17 '15 at 00:00