I've run into a few issues when working with Contour and thought I'd share my concerns and hopefully get some feedback (and possibly even workarounds?)
Biggest issue I've run into so far is the fact the component outputs BR elements with a style attribute set to "clear: both" — using BR (or similarly "suitable") element for this purpose is something we did in the past, and using BR causes big headaches in a few browsers, most notably Chrome and Safari. BR is considered a special element, and in the case of Chrome and Safari cannot be suitably styled as to not leave a big empty line-break. While this is possible in e.g. Internet Explorer and Firefox, I beg you to reconsider the use of this clearing technique altogether, but at the very least replace the BR element with a more appropriate and style friendly element.
Another issue is that the default stylesheet file provided (defaultform.css) is littered with "!important" and this is in general a big "no-no" especially since by default this file has lower priority than any stylesheet defined in the HEAD element. Obviously this can be resolved by moving stylesheets declared in the masterpage to the bottom of the page, but the fact the default stylesheet seemingly needs the specificity override signifies a problem with the stylesheet.
Hope I didn't hurt any feelings or step on any toes; hopefully one or both issues have viable workarounds, or is something that will be fixed in the not-too-distant future.
Always the best idea to share your concerns, from past experience the developer core are always listening, and all the releases of Courier have been significantly better than the previous ones and very much addressed the concerns raised through the forum, so sharing your thoughts here is highly valuable and much appreciated.
On the subject of workarounds, I did have a similar problem with the <BR /> tags and got a very useful workaround in this post:
A few concerns...
Howdy folks!
I've run into a few issues when working with Contour and thought I'd share my concerns and hopefully get some feedback (and possibly even workarounds?)
Biggest issue I've run into so far is the fact the component outputs BR elements with a style attribute set to "clear: both" — using BR (or similarly "suitable") element for this purpose is something we did in the past, and using BR causes big headaches in a few browsers, most notably Chrome and Safari. BR is considered a special element, and in the case of Chrome and Safari cannot be suitably styled as to not leave a big empty line-break.
While this is possible in e.g. Internet Explorer and Firefox, I beg you to reconsider the use of this clearing technique altogether, but at the very least replace the BR element with a more appropriate and style friendly element.
Another issue is that the default stylesheet file provided (defaultform.css) is littered with "!important" and this is in general a big "no-no" especially since by default this file has lower priority than any stylesheet defined in the HEAD element. Obviously this can be resolved by moving stylesheets declared in the masterpage to the bottom of the page, but the fact the default stylesheet seemingly needs the specificity override signifies a problem with the stylesheet.
Hope I didn't hurt any feelings or step on any toes; hopefully one or both issues have viable workarounds, or is something that will be fixed in the not-too-distant future.
For your reference:
http://www.quirksmode.org/css/clearing.html
http://perishablepress.com/press/2009/12/06/new-clearfix-hack/
Always the best idea to share your concerns, from past experience the developer core are always listening, and all the releases of Courier have been significantly better than the previous ones and very much addressed the concerns raised through the forum, so sharing your thoughts here is highly valuable and much appreciated.
On the subject of workarounds, I did have a similar problem with the <BR /> tags and got a very useful workaround in this post:
http://our.umbraco.org/forum/umbraco-pro/courier/15339-editing-html-output
Hi there,
the default css can be disabled on a pr. form basis.
Another option for custom styling is the Rest Contour package http://our.umbraco.org/projects/website-utilities/cultiv-restcontour by Cultiv aka Sebastiaan Janssen.
When it comes to the BR elements you can modify the RenderForm.ascx which can be found under /usercontrols/umbracoContour
Hope this helps,
Harald
Thanks both of you; will edit RenderForm.ascx as per your suggestions. Viable workaround for the first problem.
Wish I could give both of you a "High five!" but seems I need more karma. Thanks again!
is working on a reply...