Why does overflow-x:hidden clip my descenders?

Question

I would like to have a title element with overflow-x:hidden and overflow-y:visible. However, for some reason the overflow-y property does

Answer 1

It seems changing the H1 element into an inline element will get you the desired results:

h1 {
    margin: 10px;
    padding: 0;        
    overflow-x: hidden;
    overflow-y: visible;
    line-height: 0.5em;
    display:inline;
}

Just make sure the following element is a block element so it doesn't start in the same line. That or use the correct line-height and then use negative margins. After all, I can only guess what you're trying to do... Good luck!