Question

I need to create user control where <sc:text/> element should showed over the <sc:image>.

I know this can be achieved via CSS but in this case control cannot be configured as we cannot override inline styles.

Any hints?

Answer 1

You can achieve this using the sc:fld extension function and wrapping sc:text in markup, adding class names or ids (or inline styles if you must!).

<img src="{sc:fld( 'graphic', $sc_currentitem, 'src’ )}" class="head" />
<span class="txt"><sc:text field="txtField" /></span>

You can then style these as normal

img.head {}
span.txt {}