Welcome to WebmasterWorld Guest from 18.232.124.77

Forum Moderators: not2easy

Message Too Old, No Replies

Less space footer bottom

     
11:50 am on Dec 15, 2015 (gmt 0)

New User

joined:Dec 15, 2015
posts:1
votes: 0


Hi Guys,

I have to much (black) space on the bottem of my footer under the youtube video.

How can I reduce this black space?


css code

.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px; height: 0; overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 50%;
height: 50%;
}

[edited by: not2easy at 1:16 pm (utc) on Dec 15, 2015]
[edit reason] No Site Links/Reviews, see TOS/Charter [/edit]

2:12 pm on Dec 15, 2015 (gmt 0)

Senior Member from US 

WebmasterWorld Senior Member fotiman is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:Oct 17, 2005
posts: 5021
votes: 26


Can you post some corresponding markup? If I was to guess simply based on what I see posted here, I would guess you need to reduce the padding-bottom value on .video-container.
6:06 pm on Dec 15, 2015 (gmt 0)

Junior Member

10+ Year Member

joined:May 28, 2003
posts: 198
votes: 4


You've set the height of the iframe,object embed to 50% which means it will only be half as tall as the .video-container and thus you get the extra space.

The width and height need to be 100% to fill the video container. If you want a smaller container then reduce the width and padding-bottom on the video container.

The method you are using is to enable a fluid responsive object that retains an intrinsic aspect ratio and you need to stick to the rules as shown here:

[alistapart.com...]
7:43 pm on Dec 15, 2015 (gmt 0)

Administrator from US 

WebmasterWorld Administrator not2easy is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:Dec 27, 2006
posts:4396
votes: 314


Thanks for that link, Paul_o_b, I just found the Thierry Koblentz article link on my old drive and came in to add it, so you saved me the trouble. Other than the width and height at 50% it has the code right. It will depend on having the video container set properly as well, the article explains it better than I could.
 

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

Featured Threads

Free SEO Tools

Hire Expert Members