Style GridNumericColumn in Batch Edit mode

This article contains CSS to style the GridNumericColumn in Edit mode in a RadGrid in Batch Edit mode

The style at the bottom came from Telerik, and didn't work at all. 

This style did work. I had to add '_MetroTouch', and '!important' and 'input'; and it worked. 

.RadGrid_MetroTouch .rgBatchCurrent .rgBatchContainer input {
    font-size: 21px !important; /* Adjust the font size for better readability on tablets */
}

 

/* Style for the textboxes in the batch edit mode */
.RadGrid .rgBatchCurrent .rgBatchContainer input[type="number"] {
    font-size: 18px; /* Adjust the font size for better readability on tablets */
    font-weight: bold; /* Make the text bold to improve visibility outdoors */
    color: red; /* Set the text color to a dark shade for contrast */
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    background-color: #f0f0f0; /* Set a light background color for clarity */
    padding: 10px; /* Add padding for better touch interaction */
    border: 1px solid black; /* Define border style for a clean look */
    border-radius: 5px; /* Add rounded corners for a modern appearance */
}
 
    /* Style for the input elements when focused */
    .RadGrid .rgBatchCurrent .rgBatchContainer input[type="number"]:focus {
        outline: none; /* Remove default outline for a smoother look */
        border-color: #007bff; /* Change border color on focus for visual feedback */
        box-shadow: 0 0 5px rgba(0, 123, 255, 0.5); /* Add a shadow effect to indicate focus */
    }

RealWorldCode gives developers practical, real‑world solutions with clean, working code — no fluff, no theory, just answers.
Links
Home
Knowledge Areas
Sitemap
Contact
Et cetera
Privacy Policy
Terms and Conditions
Cookie Preferences