fedejp
fedejp

Reputation: 970

Indent table with Bootstrap

I've been using bootstrap for a while now but I can't do this thing (I don't even know how to do it without Bootstrap). What I want to is is indent either a table or divs. I've seen something like this done in Bootstrap with <li> but nothing with tables. Basically I want a table with the <th> which is the title and below the names of the projects. The reason I need to indent is because the projects depend on other projects; so the project below anoher project has to be possitioned slightly to the right of its parent (which is basically indenting, right?)

Upvotes: 3

Views: 5867

Answers (2)

Eric Nelson
Eric Nelson

Reputation: 803

Here are a couple options if what you need is a small indentation to suggest a hierarchy. They're not specific to Bootstrap tables.

The first is to add a couple nonbreaking spaces per level of indent that you want. This has the advantage that the spaces can be added by whatever code is producing the table content without disturbing the html of the table. It has the disadvantage that if the text wraps within the cell the wrapped lines will not be indented. Also, all those invisible nonbreaking spaces can lead to copy/paste surprises.

<td>&nbsp;&nbsp;Indented Text</td>
<td>&nbsp;&nbsp;&nbsp;&nbsp;Indented More</td>

If your code is emitting the html of the table, a better solution is to change the padding of the table cell by increasing amounts. It has the advantage of finer control than increments of nonbreaking space, and wrapped text is also indented. The disadvantage here is you're emitting html from code and that may make it more difficult to adjust the layout.

<td style="padding-left:20px">Indented Text</td>
<td style="padding-left:40px">Indented More</td>

Upvotes: 4

Erik Svedin
Erik Svedin

Reputation: 1286

Could this be solved using offsets? It's somewhat difficult to help when we dont know the situation or how the markup is looking.

The offset* class will add a margin-left to your element. Maybe that will help you?

Upvotes: 1

Related Questions