New to Telerik UI for ASP.NET Core? Download free 30-day trial

Axis / Container constraints

Loading Demo...

EXAMPLE
VIEW SOURCE
Change Theme
Default
SASS

LESS
- Default
- Bootstrap
- Material
- Launch Theme Builder
- Black
- Blue Opal
- Bootstrap v3
- Default
- Fiori
- Flat
- High Contrast
- Material
- Material Black
- Metro
- Metro Black
- Moonlight
- Nova
- Office 365
- Silver
- Uniform

            
                        constraints.cshtml
                    
                        ConstraintsController.cs

Also available for:

API REFERENCE

Rearrange the photos

kendo.syncReady(function(){jQuery("#sortable-horizontal").kendoSortable({"cursor":"move","axis":"x","hint":hint,"placeholder":"\u003cdiv class=\u0027placeholder\u0027\u003eDrop Here!\u003c/div\u003e","container":"#sortable-horizontal"});}); #example { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .demo-section .title { margin: 0; } #sortable-horizontal { overflow: hidden; width: 878px; text-align: center; } #sortable-horizontal img { width: 155px; margin: 10px; vertical-align: middle; cursor: move; } .placeholder { display: inline-block; width: 153px; height: 115px; border: 1px dashed #ddd; background-color: #f3f5f7; margin: 10px; font-size: 1.3em; font-weight: bold; line-height: 125px; vertical-align: middle; color: #777; } .tooltip { opacity: .6; }

Axis / Container constraints

Support & Learning Resources

Was this demo helpful?

Tell us how we can improve this demo