49

I'm new to html and I got this piece of code:

@{ ViewBag.Title = "Index"; } <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width" /> <title>View1</title> <script src="~/Scripts/jquery-1.9.1.min.js"></script> <script src="~/Scripts/bootstrap.min.js"></script> <link href="~/Content/bootstrap-theme.min.css" rel="stylesheet" /> <link href="~/Content/bootstrap.min.css" rel="stylesheet" /> </head> <body> <table> @foreach (var item in Model.Data) { <tr> <td><a [email protected][item.Key]>@item.Key</a></td> <td>@item.Value</td> </tr> } </table> </body> </html>

I want to add a tab or spaces between: <td><a [email protected][item.Key]>@item.Key</a></td> and <td>@item.Value</td> how do I do that?

I guess adding css is the best way but I don't understand how to use it.

Improve this question
3
  • 2
    In HTML &nbsp; = space, &#09; = tab. Commented Dec 10, 2014 at 14:00
  • Do you mean you want to create a gap between the tds? You probably want to either use margin or padding, both css properties Commented Dec 10, 2014 at 14:01
  • Is there a way to add the css propery without creating a new .css file? Commented Dec 10, 2014 at 14:04

4 Answers 4

Reset to default
23

You can add padding to your td with CSS:

td { padding-right: 30px; }
<table> <tr> <td><a href="#">Hello</a></td> <td>Goodbye</td> </tr> <tr> <td><a href="#">Hola</a></td> <td>Adios</td> </tr> </table>

or give them a fixed width:

td { min-width: 200px; }
<table> <tr> <td><a href="#">Hello</a></td> <td>Goodbye</td> </tr> <tr> <td><a href="#">Hola</a></td> <td>Adios</td> </tr> </table>

Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

Is there a way to add the css propery without creating a new .css file?
@PresidentCamacho Yes, as I alread said, you can just drop those <style> elements into the <head> of your .cshtml file to try them out.
I added the <style> in the <body> enclosure and it worked. Thanks!
Of course it would be bad practice to add styling to all TDs like this. It is better to add classes instead and style those.
8 
`&nbsp;` is a space `&#09;` is a tab

Just insert them where you want

For the CSS, you should use the padding property, there are plenty of tutorials on the web, and samples

Improve this answer

5 Comments

Tab or space between two table columns?
Just try it! If you fail, put your blank space into the column...
I tries adding &#09; like this: <td>&#09;@item.Value</td> but that doesn't do anything. adding without ; makes @item.Value a string and not a variable.
You must put it into the column
how do I add it into a column?
3 
<table style="border-spacing: 10px;">

Or in a CSS block somewhere:

table { border-spacing: 10px; }

Source : Add space between cells (td) using css

Improve this answer

Comments

2

You mean visual whitespace?

In that case, check this link for:

  • How to add styles for a table
  • The paragraph Table Padding specifically.

Basic CSS isn't that hard.

Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.