Editmode css

Developing with Concrete
1

I have an editable area hidden by the edit bar.
How do I use the editmode css so the area is pushed down when in admin mode.

thanks

2

Is this a custom theme?

Some pointers:

  • All theme css should be scoped to ccm-page . You can see this on a <div> immediately within <body> for Atomic or Elemental. All theme html will be within this. This prevents theme styles bleeding over core styles.

  • In edit mode the <html> container will have the class ccm-edit-mode . You can use this class to remove or adjust parts of the theme that get in the way of editing. For example, adding some top margin to your obscured area to push it down from the toolbar during edit, or preventing theme javascript from executing during edit.

  • When the toolbar is showing (for logged in users), the <html> container will also have the class ccm-toolbar-visible . This is usually used to move the theme header down the page when an administrator/editor is logged in.

There are a few other marker classes in the <html> element and <div class="ccm-page"> you may find useful - have a look at how these are set by Atomik.

3

Thanks. But this is a theme I designed myself.

4

So your theme needs to provide the above. Then you can make use of these classes to get round your bug.