Create DropDownButton with rounded corner

11 Apr 20222 minutes to read

DropDownButton with rounded corner can be achieved by adding border-radius CSS property to button element.

In the following example, e-round-corner class is defined with 5px border-radius property and added that class to button element using cssClass property.

CSHTML

<ejs-dropdownbutton id="ddbtn" items="ViewBag.items" cssClass="e-round-corner" content="Clipboard"></ejs-dropdownbutton>


<style>
    .e-round-corner {
        border-radius: 5px;
    }
</style>

Round.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using Syncfusion.EJ2.Buttons;
namespace EJ2CoreSampleBrowser.Controllers.Button
{
    public partial class ButtonController : Controller
    {
        public ActionResult DropDownButton()
        {
            List<object> items = new List<object>();
            items.Add(new
            {
                text = "Cut"
            });
            items.Add(new
            {
                text = "Copy"
            });
            items.Add(new
            {
                text = "Paste"
            });
            ViewBag.items = items;
            return View();
        }
    }
}