Fix Sitefinity 3.x Edit Mode Style

The way sitefinity positions the edit containers in design mode sometimes doesn’t look 100% like the page.  This can be due to any number of style issues with your css, however you can override your styles in design mode so the user has a better editing experience.

Plop this code into your master page code behind (and point it at the right css file)

So it’s looking for the cmspagemode to be in edit, and when it sees that it uses the awesomely handy sitefinity CssFileLink control to append a custom override stylesheet of your choice.

In my case my header content was being pushed down by the editor header, so in the designer.css I changed the margin-top property to be 25px less, and everything looked normal again! Please note, this is for Sitefinity 3.x, not 4, that’s WAY easier by just checking for .sfPageEditor on the body element.