Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Place forms and videos on images

Hello.

I'm trying to give a youtube video a drop shadow but I couldn't figure out how to do this using css...

Is that coved here at tree house?

What series should i need to watch..

Also i wanted to learn how to place videos and form on top of images... can someone please direct me to the right training?

4 Answers

Justin Wiswell
Justin Wiswell
9,471 Points

This isn't a catch-all answer but I can suggest a few directions to look into:

1) Adding a drop-shadow to a Youtube video: There are courses that show you how to setup shadows on elements in general, they are covered in the CSS deepdive I believe.

2) Placing elements on top of other elements could be achieved by using z-index and adding positioning to selectors, which does come up in the css deep-dive at points.

Wow! Thanks

Travis Avey
Travis Avey
18,876 Points

Hello,

Videos can be a pain. Old browsers require flash, while the new thing is the video tag in html5. If you are using a YouTube video, I imagine that you are embedding it with an iframe ?

You could try targeting the iframe in your css

iframe {
  box-shadow: 2px 2px 4px #000;
}

As far as placing things on images, just use the image as the background.

div {
  background-image: url(path/to/your/img.png);
}

For more on CSS try CSS Foundations by Guil Hernandez.

Thanks