converted theme edit mode having issues

Permalink
I recently converted a theme for the first time & it was looking good until I go to edit mode. When I hover over my editable area, the gray block that usually shows up to click on is not on the top of the content, but it is pushed down a little. (see attached files for screenshots of the problem - it is difficult to explain) It is still clickable, but will most likely be confusing for anyone other than myself to use. Any suggestions on what went wrong?

2 Attachments

 
Mnkras replied on at Permalink Reply
Mnkras
in the theme i think you may have added to many px for the "is in editmode" maybe you added it 2 times or something check the files along with the for in the themes directory to make sure the "is in editmode" is not in there already

this is just a guess
drw replied on at Permalink Reply
drw
I have exactly the same problem. The dark mask that appears as you move over an editable block appears about 40px below the red dotted block outline. This happens on all blocks. Can anyone please offer any insight as to why this occurs?
Mnkras replied on at Permalink Reply
Mnkras
use an is editmode check and just move everything down by 40px, thats one of the things it was made for :)
drw replied on at Permalink Reply
drw
Tks for your help Mnkras but it doesn't appear that: if ($c->isEditMode()) is a solution. If I include that statement along with a div spacer then yes, the editable blocks do get pushed down by the height of the spacer but, when I move my cursor over an editable block the shaded mask appears 40 px lower i.e. the shaded mask is not affected by the spacer, it simply remains relative to where the edited block is.

What I'm looking for is the reason for the relative offset. Any further ideas?
drw replied on at Permalink Reply
drw
The problem appears to be caused by the C5 editing bar that appears above the site template. This pushes down the modal popup dialog box BUT not the red dotted block that indicates editable space.

As I said in my earlier post, using: if ($c->isEditMode()) [wrapped in php tags] and using a div spacer pushes the editable block down but the modal offset remains unaffected .... HELP! (please)
drw replied on at Permalink Reply
drw
I've just noticed that if I put a negative offset into my Body CSS def. (as below), the edit block lines up correctly. Downside is that the top of my site disappears under the C5 edit!

body {
background:url(images/BG-Grad.jpg);
background-repeat:repeat-x;
min-height: 450px;
position: relative;
top: -45px;
width: 1000px;
margin-left: auto ;
margin-right: auto ;
}

Maybe the solution is obvious to someone in the C5 community?
drw replied on at Permalink Reply
drw
Turned out that the problem was caused by the use of the position statement in the CSS for body. Simply removed:
position: relative;
(and also the top offset) and all was fine. Oh well, you live'n learn!