Block Hover skewiff
Permalink 1 user found helpful
Hi,
For some reason the 'dark' area or 'editable area' is skewiff when I hover my mouse over it in the DASHBOARD/PAGE edit mode.
It has dropped by .5 inches which makes it hard to hover and click-on once you have a number of narrow editable fields..
It has happened on 3 of my sites, do anybody else experience these issues?
(I am not sure if I have explained it properly)
Let me try another visual :)
the editable region usually with red-dotted lines around them, have a dark (see thru) box in them when you hover your mouse, and you can click to ADD/EDIT/ETC - now when I hover my mouse in the red dotted area the dark box appears .5" below the actual area for editing..
Any input greatly appreciated
The only changes I have done lately are adding Facebook Like using the ADD-ON and Google Translate hard coded into my pages
For some reason the 'dark' area or 'editable area' is skewiff when I hover my mouse over it in the DASHBOARD/PAGE edit mode.
It has dropped by .5 inches which makes it hard to hover and click-on once you have a number of narrow editable fields..
It has happened on 3 of my sites, do anybody else experience these issues?
(I am not sure if I have explained it properly)
Let me try another visual :)
the editable region usually with red-dotted lines around them, have a dark (see thru) box in them when you hover your mouse, and you can click to ADD/EDIT/ETC - now when I hover my mouse in the red dotted area the dark box appears .5" below the actual area for editing..
Any input greatly appreciated
The only changes I have done lately are adding Facebook Like using the ADD-ON and Google Translate hard coded into my pages
I have the same problem. But, you had this problem last year, so maybe you don't care any more. I'm trying to find out a css call that will correct it, like position:relative; If anyone knows of a correction to this misaligned hover, let me know. If I figure it out, I'll post it.
Ok. I give up. I tried using css and everything I tried got overwritten by element.style. My hovers appear about 50px below what they are supposed to. I made my own theme using the foundation responsive framework and some js within must be nudging all of the hovering grey boxes down. I'm not using Google translate. I'm surprised there is no tutorial showing developers how to adjust the editing components. Could anyone help?
I could take a look, but then I need to have edit access to your site (or at least on one page). You can send details in pm if you want me to have a look.
PM to you on the way with link to the test site. Thank you!
I have had a look and then it hit me: There is a how-to on issues with the Foundation framework by Job which deals with this issue: http://www.concrete5.org/documentation/how-tos/developers/using-zur...
Basically, you can add the following right before your closing </head> in your header.php file to get around the margin nudge.
So why 49px? Well, c5 adds a 49px margin-top to your <body> when logged in with edit permissions to make room for the edit bar. Unfortunately the Foundation framework screws that up and you need to remove 49px from the #ccm-highlighter id which is then added again by js after page is loaded (gives you a total margin-top of 0px) and the highlighter now lines up with your divs again.
Basically, you can add the following right before your closing </head> in your header.php file to get around the margin nudge.
<?php $c = Page::getCurrentPage(); if ($c->isEditMode()) { ?> <style type="text/css">#ccm-highlighter {margin-top:-49px;}</style> <?php } ?>
So why 49px? Well, c5 adds a 49px margin-top to your <body> when logged in with edit permissions to make room for the edit bar. Unfortunately the Foundation framework screws that up and you need to remove 49px from the #ccm-highlighter id which is then added again by js after page is loaded (gives you a total margin-top of 0px) and the highlighter now lines up with your divs again.
Thank you Adajad. You got it! In your PM to me, you had left out the "c" in the line
which caused a php error causing me to try the code without that line, so as far as I can tell, this works too:
Either way, this was a tremendous help because I plan on using the Foundation framework to build more C5 themes.
$c = Page::getCurrentPage();
which caused a php error causing me to try the code without that line, so as far as I can tell, this works too:
<?php if ($c->isEditMode()) { ?> <style type="text/css">#ccm-highlighter {margin-top:-49px;}</style> <?php } ?>
Either way, this was a tremendous help because I plan on using the Foundation framework to build more C5 themes.
Awesome, this is just what I was looking for.
Thanks
Thanks
