How to Put Space Between Columns in Gridview

By Lysis

Padding cells in the ASP.NET gridview control sets spaces between the information contained within the cell and the borders. This formatting is called "cell padding" and "cell spacing." These two properties help programmers display data more professionally. Padding cells is accomplished using pixel settings in the gridview control. The gridview is programmed using typical HTML tags. Within these tags are properties, and these properties include cell padding and spacing configurations. Once you've added a gridview control to the web page, setting spaces between cells is accomplished by changing these properties.

Step 1

Open a new page in your Visual Studio .NET console. From the toolbox, drag and drop the gridview control onto the new page. This will automatically create the HTML code and the default values for the gridview.

Step 2

Click the tab in your workspace labeled "Code." This will show the actual HTML of the gridview rather than the layout on the page. Editing the code gives you more control and options than in design view.

Step 3

Locate the gridview HTML tag labeled "." Within this tag are several properties, but cell padding and spacing are automatically set to zero by the Visual Studio application.

Step 4

Enter "cellpadding=5" into the gridview HTML tag. Return to the design view by clicking the "Design" tab on your console. You will notice that the cells become larger. This accounts for the padding between the text and the borders of the cell.

Step 5

Click the "Code" tab again in the Visual Studio console. Return to the gridview tag and enter "cellspacing=5" into the HTML tag. Return to design view and notice that the cells are spaced farther apart from each other. While cell padding spaces contained text from the board, cell spacing inserts a space between each cell.

Step 6

Save the new file and view it in a browser. You can view the page in the browser quickly by right-clicking the page and selecting "View in browser." This will allow you to test your new settings. Increase or decrease the value for each of these properties until you find the right spacing for the gridview cells.

References

Writer Bio