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

Posted by ahmed yaseen
ahmed yaseen
92 Points

centering a youtube video in css i wanna make a video page and center the video in middle i tried but i doesnt move

i wanna make a video page and center the video in middle i tried but i doesnt move

5 Answers

ahmed yaseen
ahmed yaseen
92 Points
ahmed yaseen
ahmed yaseen
92 Points

vtest

{ margin: 0px auto; } and i tried left:50% top:50% transform:translate i applied alot of videos

evan rost
evan rost
Courses Plus Student 13,971 Points
evan rost
evan rost
Courses Plus Student 13,971 Points

what element are you targeting? is this for a code challenge?

ahmed yaseen
ahmed yaseen
92 Points
ahmed yaseen
ahmed yaseen
92 Points

no i,m making a website and i completed it but i wanna make a video page and im targeting the i frime and i give it an id then i put it in a div and no thing happent

evan rost
evan rost
Courses Plus Student 13,971 Points
evan rost
evan rost
Courses Plus Student 13,971 Points

its hard to tell without seeing more of your code. is your project on github? here is a link to a good article on css centering. https://css-tricks.com/centering-css-complete-guide/

Parth Gada
Parth Gada
8,484 Points
Parth Gada
Parth Gada
8,484 Points

Create a div class in your HTML file and use align-content: center; property in CSS to center it

ahmed yaseen
ahmed yaseen
92 Points

idid but it appears left top it doesnt move

ahmed yaseen
ahmed yaseen
92 Points
ahmed yaseen
ahmed yaseen
92 Points

thanks alot bro i.ll see

Rachel Campbell
Rachel Campbell
9,103 Points
Rachel Campbell
Rachel Campbell
9,103 Points

Is it a YouTube iframe embed code? If so, wrap the entire <iframe>....</iframe> in another set of <div> </div> tags and set <div style="text-align:center">. Maybe not the most elegant solution, but it works for the YouTube embeds. So, for example (I just picked a random video):

<div style="text-align: center;">
    <iframe width="560" height="315" src="https://www.youtube.com/embed/zrdQrHu158E" frameborder="0" allowfullscreen></iframe>
</div>
evan rost
evan rost
Courses Plus Student 13,971 Points
evan rost
evan rost
Courses Plus Student 13,971 Points

you may have to make the parent elements width 100%, then try centering the child element