When i put blocks inside my contentarea the blocks align just fine but inside of edit-mode the "edit-boarder" gets messed up.
Does anyone have any idea how to figure this out?
See picture for more details
http://postimg.org/image/7wyue4nvv/
Code for contentarea, block and css:
Best regards Simon
My solution
The main issue was to fully understand how episerver renders content areas and the blocks in coherence with css. It’s important to check the html that epi renders out to the browser, which will be one div for the content area itself, one extra generated (that IS needed and that epi said them self that they chose to render out and you cant do anything about it) div for the editmode wraper, and then your block.
In edit-mode the sites content is actually iframed in, and will as a result load after the epi-edit wrapper of each individual block. If your blocks look like mine, floated, the epi-wrapper will act as with any floated element and not understand the height of the content. Long story short; add a class to the content area tag with style "overflow: hidden;" to fix the floating, then remove your blocks wrapper div (which isn't needed) and use the epi-rendered div for that! Do this with the anonymous object you can put on the content area render tag, like so: new { CssClass = "classnamewithoverflow", ChildrenCssClass = "blocknamewithfloat" } ).
This obviously only works smoothly with blocks of the same width, but making different block-widths work is another story :-)