I have using Aardvark theme for many years (thanks Shaun).

With my latest Aardvark theme deployment I had a problem that the fixed header was relative big (160 pixel) and when using hash tag links in the courses the content of the anchors was covered by the header. I needed to offset the anchors for fix this.

After digging the net I have found Chris Coyier post titled Hash Tag Links That Don’t Headbutt The Browser Window. Using the fancier clean HTML method I have added the following CSS code at the / Site administration / Appearance / Themes / Aardvark page / Custom CSS textarea:

.section:before {margin-top: -60px; height: 60px; visibility: hidden; content: " "; display: block;} /*section offset*/
.breadcrumb-button {position: relative;} /*fix for the breadcrumb button*/

Now it is under testing, but in this short time it worked well.

Related links:
https://moodle.org/plugins/view.php?plugin=theme_aardvark
https://css-tricks.com/hash-tag-links-padding/

2 thoughts to “Moodle plugin: Aardvark theme – Anchor Offset to Adjust for Fixed Header

Leave a comment

Your email address will not be published. Required fields are marked *

Time limit is exhausted. Please reload the CAPTCHA.