CSS

For the second time, I needed to adjust the CSS for a site that is using anchor links. The problem was, the page would scroll down too far because of a fixed menu at the top of the page, and the anchor link area ended up underneath the menu.

The fix is to add this to the site’s CSS:

:target:before {
content:””;
display:block;
height:55px; /* fixed header height*/
margin:-55px 0 0; /* negative fixed header height */
}

Change the height and margin to match the height of the fixed menu. Sometimes the display setting needs a little tweaking, too. Woo!