Add Rounded Borders to Fields
This article shows you how to add CSS3 rounded corners to your DataPage fields. Please note that this technique will not appear on Internet Explorer as that browser has not yet adopted the CSS3 standards. Rounded corners will appear on other next generation browsers including: Firefox, Chrome, Opera, Safari, etc. Although this technique does not work on the current version of Internet Explorer it is commonly employed by popular websites.
Steps to adding rounded borders:
In the Caspio Bridge proceed to the Styles section. Select the style you would like to change and click the Edit button.
On the Define Style Settings screen, click on the Source tab to view the CSS source.
In the DataPage Elements panel, under the Forms/Details section locate the Fields sub-section. Each of these elements should already contain a border style. We are going to add some CSS to these elements to round the border edges. Add the following code to these elements: .cbFormTextField, .cbFormTextArea, .cbFormPassword
-moz-border-radius: 6px; -webkit-border-radius: 6px; -khtml-border-radius: 6px; border-radius:6px;
You can adjust how rounded the corners are by increasing or decreasing the radius number (6px).
Note: Your fields must have a border style to have rounded borders (for example, border:2px solid grey;).