Travelmyway Travelmyway - 1 year ago 96
Javascript Question

How to increase the border width for select tags in kendo ui

Iam using kendo-ui for implementing select tags.

The border is appearing very light as you can see in this but i want to increase the width of the border.

Below is my code my aim is to achieve to increase the size of the border.

$(document).ready(function() {
// create ComboBox from input HTML element
// create ComboBox from select HTML element
var select = $("#size").data("kendoComboBox");

html {
font-size: 14px;
font-family: Arial, Helvetica, sans-serif;

<!doctype html>

<link rel="stylesheet" href="//" />
<link rel="stylesheet" href="//" />
<link rel="stylesheet" href="//" />

<script src="//"></script>
<script src="//"></script>
<div id="example" role="application">
<div id="tshirt-view" class="demo-section k-content">

<h4 style="margin-bottom: .5em;">T-shirt Size</h4>
<select id="size" placeholder="Select size..." style="width: 300px;">
<option />X-Small
<option />Small
<option />Medium
<option />Large
<option />X-Large
<option />2X-Large



Answer Source

The border is set on the wrappers with a class k-dropdown-wrap You can therefore override the border width with:

  border-width: 3px !important;
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download