This is a migrated thread and some comments may be shown as answers.

How to style a Span to look like a validation popup with arrow

1 Answer 114 Views
Validation
This is a migrated thread and some comments may be shown as answers.
Shawn
Top achievements
Rank 1
Shawn asked on 19 Jun 2019, 06:04 PM

Hello,

I'm trying to customize a span element to look like a validation popup with the arrow on top pointing to an input element.  I am not able to use validation in this case, and I'm trying to display a tooltip instead.  I have the following:

<span id="validation" class="k-widget k-tooltip k-tooltip-validation k-x-invalid-msg-block"></span>

 

The code above almost works, however, the little directional arrow on top of the span is not displayed.  If I include 'k-callout' and 'k-callout-n' then the entire span moves and is distorted.  Can anyone help me get the little arrow to show up?   Any help is appreciated. Thanks!

1 Answer, 1 is accepted

Sort by
0
Eyup
Telerik team
answered on 20 Jun 2019, 02:54 PM
Hello Shawn,

Kendo grid validation works in a similar fashion:
https://demos.telerik.com/kendo-ui/grid/editing-custom-validation

Could you send a sample image to demonstrate how exactly you want your tooltip to look like? You can modify the following live dojo sample and send it back to us. Then, I will be able to modify it depending on your scenario:
https://dojo.telerik.com/OmAGUPIL/4

Regards,
Eyup
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
Validation
Asked by
Shawn
Top achievements
Rank 1
Answers by
Eyup
Telerik team
Share this question
or