Question

It seems I’m having an issue with a design I’m working on. I’m using the kickstart HTML framework but I have a couple issues.

Firstly is that there is a very large white gap between the top of my page (logo, navbar) and the text.

Secondly I’ve tried to overlay the logo over the the navbar by using z-index. However it causes a negative horizontal scroll. I’ve tried to hide it by hiding overflow-x but it just doesn’t seem like the best solution.

You can see the issues at http://jkr.me.uk/problem.html

Thanks,

John

Answer 1

Using position: relative on the logo makes it take up space that you’re refferring to.

Instead, use float: right, or position it with position: absolute;