Cannot Edit Place Holder

After applying a stylesheet to a template I cannot edit some content place holders.  In Overlay mode, the problem place holders appear grayed out.  In Classic mode I can drop one, and only one, control into a problem place holder.  If I do not apply the stylesheet I can edit all place holders in both Overlay and Classic mode.  All the problem place holders are on a single line, no spaces and are closed with />.

If you look at the image you can see the difference between an editable (footer) placeholder and non-editable (navigation, bodycontent, extras) placeholders.

I've narrowed it down to the css floats being used to create the 3 column layout.  Remove the floats and the place holders work again.  Any reason that floats would not work in Sitefinity Themes?  Seems like a bug...

Hello Josh,

Floats are used for Sitefinity layouts and there should not be any problems with them if you examine the css output of the default theme. Maybe there is some conflict in your theme css or a conflict with an additional css declarations of cs used by the widgets in those placeholders. You can examine the problem closely with firebug.
Try using percentage values if this suits your needs.

Regards,
Stanislav Velikov
the Telerik team

Thanks Stanislav,

I tried your suggestions, with no luck.  Changing to percentages instead of pixels did nothing.  Firebug revealed nothing unusual and my theme is based on a single css file with no other embedded css, so not sure where there would be a conflict.  Also there are no controls/widgets in my placeholders yet...they are empty.

Below is the code that lays out the 3 columns:

Hello Josh,

The css causes your placeholders to overlap. It is observed on (navigation, bodycontent, extras) but not on footer because it uses:

Stanislav,

I've uploaded another image with the size of the placeholders altered to show that they do not overlap, yet still the placeholders are not editable.

Maybe I'm missing something but I'm not sure how your example applies to a horizontal three-column floated layout.  The two columns you do show would be stacked vertically due to the clear: both.

Hello Josh,

Please take a look at  your installed Themes (example: Blue with right sidebar). This is very good example of how to structure your css to resolve your problem. Define the #wrapper declaration and note the Header hosts the two placeholders that appear uneditable. Notice the placeholders are floated in the Header which is clear:both; . Or simply said get the css from the pre-made theme see the structure of it and change the Id`s and properties with yours and you will observe the result you seek. Also note

Hi Stanislav,

I'm not able to get the CSS for the default template (blue with right side bar).  Is it available on sitefinity.com anywhere?

Thanks,

Josh

Hello Josh,

I suppose you are using Sitefinity 3.7. The Template is included in the installation and is available at ~/Sitefinity3.7/WebSites/yourwebsite/App_Themes . I have attached it to this post. When you place a Theme in App_Themes Sitefinity will automatically recognize it is a theme and you will be able to apply it.

Write back if you have more questions.

Regards,
Stanislav Velikov
the Telerik team

Stanislav,

Starting from scratch and using the default template (blue with right side bar) worked.  My content area is now working properly.  Thank you for your help.