Name is required.
Email address is required.
Invalid email address
Answer is required.
Exceeding max length of 5KB

Of padding, boxes, and margins

I'm working off a template called HTML5up's Read Only. I got the player to work--thanks to some keen eyes on this site, but now I'm trying to get rid of the big fat space beneath the header and my player. I have looked all over the CSS for what is creating the gap. I've used a debugger to find padding codes, none of them changed it.

I also found this code: webkit-box-sizing: border-box;
box-sizing: border-box;,



Is that what I should be focusing on. The page in question is at vrocchio.net/up2/index.html if that helps.

4 Community Answers

Up Down

jherrieven

User  
0 rated :

The following is adding a 4em padding to the top of the ".container" class:

#main > section > .container {
padding: 4em 0 2em 0;
}

This is in "style-xlarge.css".

James Herrieven

Up Down

roccboy3

User  
0 rated :

That made a difference, but there's still a gap. And certainly if I add to the value, the gap is bigger than before.

Does this mean there's another padding setting in one of the other css files? Or should I be looking for something else?

Up Down

MisterNeutron

User  
0 rated :

This isn't a JW Player question at all. The gap below your header image is a product of the page layout produced by whatever package you're using to create the page. You'll have to ask the folks who produced it why it's doing that. This isn't really the place for general HTML/CSS issues.

Up Down

roccboy3

User  
0 rated :

You're right. Sorry

This question has received the maximum number of answers.